/* YF frontend page styles. Extracted from the template in original cascade order.
   QT-127 removes stylesheet branches belonging only to retired interfaces and removes
   page-level declarations duplicated exactly by a later shared component stylesheet.
   Active layouts, compatibility fallbacks and intentional cascade overrides are preserved. */
html,body{margin:0!important;
  padding:0!important;
  width:100%!important;
  overflow-x:hidden!important;
  background:#ffffff;
  color:#111;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;}
html{font-size:16px!important;}
*{box-sizing:border-box;
  -webkit-tap-highlight-color:transparent;}
body{font-family:Arial,Helvetica,sans-serif;}
button,a,input{outline:none!important;
  -webkit-tap-highlight-color:transparent;}
button:focus,a:focus,input:focus,textarea:focus,select:focus{outline:none!important;
  box-shadow:none!important;
  border-color:inherit!important;}
:focus-visible{outline:none!important;box-shadow:none!important}
html,body,.wp-site-blocks,.entry-content,.wp-block-post-content,.wp-block-group,main{margin-top:0!important;
  padding-top:0!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  max-width:none!important;
  width:100%!important;}




.yf-search{flex:1;
  min-width:0;
  height:33px;
  display:flex;
  align-items:center;
  padding:0 0 0 10px;}
.yf-search svg{width:18px;
  height:18px;
  color:#999;
  flex-shrink:0;}
.yf-search input{flex:1;
  min-width:0;
  border:0;
  border-radius:0!important;
  -webkit-appearance:none!important;
  appearance:none!important;
  background:transparent;
  font-size:16px;
  margin:0 7px;
  color:#111;}
.yf-search input::placeholder{color:#bdbdbd;}









.yf-wa{position:fixed;
  right:12px;
  top:48%;
  width:42px;
  height:42px;
  background:transparent;
  border:0;
  border-radius:0;
  display:grid;
  place-items:center;
  z-index:9999;
  box-shadow:none;
  opacity:1;
  text-decoration:none;
  cursor:pointer;
  color:#46d86f!important;
  user-select:none;
  touch-action:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;}
.yf-wa svg{width:42px;
  height:42px;
  fill:none;
  stroke:#46d86f!important;
  color:#46d86f!important;}
.yf-wa svg path{stroke:#46d86f!important;}

@media (max-width:767px){.yf-wa{display:grid!important;


    width:42px!important;
    height:42px!important;
    
    
    pointer-events:none!important;
    
    will-change:bottom,top,opacity,transform;}

.yf-wa.yf-wa-bounce{animation:yf-wa-soft-bounce .62s ease-out .36s 1 both;}
@keyframes yf-wa-soft-bounce{0%{transform:translateY(0) scale(1)}
38%{transform:translateY(-5px) scale(1)}
62%{transform:translateY(2px) scale(1)}
82%{transform:translateY(-2px) scale(1)}
100%{transform:translateY(0) scale(1)}}}
.yf-top{position:fixed;
  right:12px;
  bottom:70px;
  width:36px;
  height:36px;
  border-radius:50%;
  border:1px solid rgba(0,0,0,.45);
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(3px);
  box-shadow:none;
  z-index:999;
  opacity:0;
  pointer-events:none;
  transition:opacity .8s ease;}
.yf-top.yf-top-active{opacity:1;
  pointer-events:auto;}
.yf-top:before{content:"↑";
  font-size:20px;
  font-weight:400;
  color:rgba(0,0,0,.55);
  line-height:33px;}
.yf-bottom{position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:calc(50px + max(0px, env(safe-area-inset-bottom, 0px)))!important;
  padding-bottom:max(6px, env(safe-area-inset-bottom, 0px))!important;
  background:#fff!important;
  border-top:1px solid rgba(0,0,0,.06)!important;
  grid-template-columns:repeat(2,1fr);
  z-index:9999;
  box-sizing:border-box!important;
  box-shadow:0 -2px 10px rgba(0,0,0,.05);
  transition:opacity 1s ease;}
.yf-bottom.yf-bottom-hidden{opacity:0;
  pointer-events:none;}
.yf-bottom.yf-bottom-dimmed{opacity:.3;
  pointer-events:auto;}
.yf-bottom-cell{display:flex;
  align-items:center;
  justify-content:center;}
.yf-bottom-cell a{text-decoration:none;
  color:#111;
  font-size:10px;
  font-weight:500;
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  cursor:pointer;
  padding:4px 12px;}
.yf-bottom svg{width:20px;
  height:20px;
  stroke:#111;
  fill:none;
  stroke-width:1.7;}
.yf-drawer{position:fixed;
  background:#fff;
  border-radius:8px;
  box-shadow:0 4px 16px rgba(0,0,0,.1);
  z-index:100000;
  display:none;
  overflow:hidden;
  min-width:80px;}
.yf-drawer.show{display:block;}
.yf-drawer button{display:block;
  width:100%;
  min-height:34px;
  padding:0 14px;
  border:0;
  border-bottom:1px solid #f5f5f5;
  background:#fff;
  text-align:left;
  font-size:12px;
  font-weight:600;
  color:#555;
  cursor:pointer;
  white-space:nowrap;}
.yf-drawer button:last-child{border-bottom:0;}
.yf-drawer button:active{background:#fafafa;}
.yf-backdrop{position:fixed;
  inset:0;
  background:rgba(0,0,0,.25);
  z-index:20000;
  display:none;
  opacity:0;
  transition:opacity .25s ease;}
.yf-backdrop.show{display:block;
  opacity:1;}
.yf-sheet{position:fixed;
  z-index:20001;
  background:#fff;
  border-radius:14px 14px 0 0;
  max-height:60vh;
  display:flex;
  flex-direction:column;
  transform:translateY(12px);
  transition:transform .3s cubic-bezier(.4,0,.2,1);}
.yf-sheet.show{transform:translateY(0);}
.yf-sheet.sheet-center{left:0;
  right:0;
  bottom:50px;}
.yf-sheet.sheet-right{right:6px;
  bottom:50px;
  left:auto;
  width:auto;
  min-width:150px;
  max-width:calc(100vw - 12px);
  border-radius:10px 10px 0 0;}
.yf-sheet.sheet-cat{right:6px;
  bottom:50px;
  left:auto;
  width:auto;
  border-radius:10px 10px 0 0;}
.yf-sheet-head{display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 12px;
  border-bottom:1px solid #f0f0f0;
  flex-shrink:0;
  font-size:14px;
  font-weight:700;
  color:#111;}
.yf-sheet-close{width:26px;
  height:26px;
  border:0;
  border-radius:50%;
  background:#f0f0f0;
  color:#666;
  font-size:16px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;}
.yf-sheet-back{border:0;
  background:none;
  color:#999;
  font-size:12px;
  cursor:pointer;
  padding:0;}
.yf-sheet-body{padding:8px 10px 16px;
  overflow-y:auto;
  flex:1;}
.yf-contact-body{display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  min-height:0!important;}
.yf-contact-scroll{flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
  padding-right:0!important;}
.yf-contact-actions{flex:0 0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
  padding-top:8px!important;
  padding-bottom:0!important;
  background:#fff!important;}

.yf-contact-row{display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  background:#fafafa;
  border:1px solid #f1f1f1;
  border-radius:10px;
  padding:9px 10px;
  margin-bottom:6px;}
.yf-contact-row small{display:block;
  color:#777;
  font-size:11px;
  margin-bottom:3px;}
.yf-contact-row span{font-size:14px;
  word-break:break-all;}
.yf-contact-copy{
  border-radius:10px;
  background:linear-gradient(#f7f7f7,#ecebea);
  
  padding:8px 12px;
  font-size:12px;
  
  
  flex-shrink:0;
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;}
.yf-contact-wa{display:block;
  order:1!important;
  margin:0;
  text-align:center;
  text-decoration:none;
  background:#25d366;
  color:#fff;
  border-radius:12px;
  padding:12px 10px;
  font-size:16px;
  font-weight:800;}
.yf-contact-tip{order:3!important;
  text-align:center;
  color:#888;
  font-size:11px;
  margin-top:6px!important;
  padding-bottom:1px!important;}
.yf-msg-btn{display:block;
  order:2!important;
  width:100%;
  margin-top:8px!important;
  padding:12px;
  border:1px solid #ff6a00;
  border-radius:10px;
  background:#ff6a00;
  color:#fff;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  text-align:center;
  box-shadow:0 1px 3px rgba(0,0,0,.06);}
.yf-cat-wrap{display:flex;
  flex-direction:row;}
.yf-cat-col{display:flex;
  flex-direction:column;
  gap:1px;
  flex-shrink:0;}
.yf-cat-col-l1{min-width:105px;
  padding-right:4px;
  border-right:1px solid #eee;}
.yf-cat-col-l2{min-width:95px;
  padding:0 6px;
  border-right:1px solid #eee;
  display:none;}
.yf-cat-col-l2.show{display:flex;}
.yf-cat-col-l3{min-width:95px;
  padding-left:6px;
  display:none;}
.yf-cat-col-l3.show{display:flex;}
.yf-cat-item-l1{display:block;
  padding:5px 10px;
  margin:0;
  border:0;
  background:none;
  color:#3a4a5c;
  font-size:13px;
  font-weight:500;
  cursor:pointer;
  white-space:nowrap;
  text-align:left;
  border-radius:4px;
  transition:background .12s;
  position:relative;}
.yf-cat-item-l1:hover,.yf-cat-item-l1:active{background:rgba(0,0,0,.04);}
.yf-cat-item-l1.sel{color:#ff6a00;
  font-weight:700;
  background:rgba(0,0,0,.04);}
.yf-cat-item-l1.has-child::after{content:"▶";
  float:right;
  font-size:9px;
  color:#ff6a00;
  margin-left:10px;
  line-height:1;
  opacity:.75;}
.yf-cat-item-l2{display:block;
  padding:5px 8px;
  border:0;
  background:none;
  color:#3a4a5c;
  font-size:12px;
  font-weight:500;
  cursor:pointer;
  white-space:nowrap;
  text-align:left;
  border-radius:3px;
  transition:background .12s;}
.yf-cat-item-l2:active,.yf-cat-item-l2:hover{background:rgba(0,0,0,.04);}
.yf-cat-item-l2.sel{color:#ff6a00;
  font-weight:600;}
.yf-cat-item-l3{display:block;
  padding:4px 8px;
  border:0;
  background:none;
  color:#777;
  font-size:12px;
  font-weight:400;
  cursor:pointer;
  white-space:nowrap;
  text-align:left;
  border-radius:3px;
  transition:background .12s;}
.yf-cat-item-l3:active,.yf-cat-item-l3:hover{background:rgba(0,0,0,.03);}
.yf-cat-item-l3.sel{color:#3a4a5c;
  font-weight:500;}
.yf-cat-item-l2.has-child::after{content:"▶";
  float:right;
  font-size:9px;
  color:#ff6a00;
  margin-left:6px;
  line-height:1;
  opacity:.75;}
.yf-interest-item{


  border-bottom:1px solid #f0f0f0;}
.yf-interest-check{
  
  flex-shrink:0;
  accent-color:#ff6a00;}
.yf-interest-img{width:44px;
  height:44px;
  object-fit:cover;
  border-radius:0!important;
  flex-shrink:0;}

.yf-interest-del{


  background:#f0f0f0;
  
  
  flex-shrink:0;
  cursor:pointer;


  }
.yf-interest-send{display:block;
  width:100%;
  margin-top:12px;
  padding:12px;
  border:0;
  border-radius:10px;
  background:#25d366;
  color:#fff;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  text-align:center;}
.yf-detail-actions{display:flex;
  gap:6px;
  margin-top:6px;}
.yf-detail-interested{flex:1;
  padding:10px;
  border:0;
  border-radius:0;
  background:#ff6a00;
  color:#fff;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  text-align:center;}
.yf-detail-buy{display:none;
  flex:1;
  padding:10px;
  border:1px solid #ff6a00;
  border-radius:6px;
  background:#fff;
  color:#ff6a00;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  text-align:center;}
.yf-toast{position:fixed;
  bottom:auto;
  left:50%;
  transform:translateX(-50%);
  background:#333;
  color:#fff;
  width:max-content;
  max-width:min(560px,calc(100vw - 32px));
  min-height:46px;
  padding:14px 18px;
  border-radius:14px;
  font-size:13px;
  z-index:99999;
  opacity:0;
  transition:opacity .3s;
  pointer-events:none;
  line-height:1.45;
  text-align:center;
  white-space:normal;
  box-sizing:border-box;}
.yf-toast.show{opacity:1;}

.yf-search{border-radius:5px!important;
  -webkit-border-radius:5px!important;
  overflow:hidden!important;
  box-shadow:none!important;
  outline:none!important;}
.yf-search input,.yf-search svg{border-radius:0!important;
  -webkit-border-radius:0!important;
  box-shadow:none!important;
  outline:none!important;
  -webkit-appearance:none!important;
  appearance:none!important;}



footer,.wp-site-blocks>footer,.wp-block-template-part,.site-footer,.entry-title,.wp-block-post-title{display:none!important;}
.yf-detail-page{
  --yf-detail-nav-item-height:33px;
  width:100%;
  background:#ffffff;
  padding:36px 0 72px!important;
  margin-top:0!important;
  min-height:100vh;}
.yf-detail-hero{position:relative;
  overflow:hidden;
  background:#f7f7f7;
  line-height:0;
  touch-action:pan-y;}
.yf-detail-main-img{width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  display:block;
  background:#f7f7f7;
  border-radius:0!important;}
.yf-detail-arrow{position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.88);
  color:#666;
  font-size:20px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:34px;
  cursor:pointer;
  opacity:0;
  transition:opacity .25s ease;}
.yf-detail-hero:hover .yf-detail-arrow{opacity:1;}
.yf-detail-arrow:active{background:rgba(255,255,255,.95);}
.yf-detail-prev{left:8px;}
.yf-detail-next{right:8px;}
.yf-detail-video-overlay{position:absolute;inset:0;
  background:#111;
  display:flex;
  align-items:center;justify-content:center;
  z-index:3;cursor:pointer;}
.yf-detail-video-play-btn{width:62px;height:62px;
  border-radius:50%;
  background:rgba(0,0,0,.55);
  border:2px solid rgba(255,255,255,.85);
  cursor:pointer;
  display:flex;
  align-items:center;justify-content:center;}
.yf-detail-video-play-btn::after{content:"";
  display:block;
  width:0;height:0;
  border-top:13px solid transparent;
  border-bottom:13px solid transparent;
  border-left:22px solid #fff;
  margin-left:4px;}
.yf-detail-thumb-video{position:relative;
  width:64px;height:64px;
  flex-shrink:0;
  border-radius:6px;
  background:#222;
  cursor:pointer;
  display:flex;
  align-items:center;justify-content:center;
  overflow:hidden;}
.yf-detail-thumb-video::after{content:"";
  display:block;
  width:0;height:0;
  border-top:10px solid transparent;
  border-bottom:10px solid transparent;
  border-left:18px solid rgba(255,255,255,.9);
  margin-left:3px;}
.yf-detail-thumb-video.sel{outline:2px solid #ff6a00;outline-offset:-2px;}
.yf-detail-thumb-video:hover{background:#333;}
.yf-detail-video-layer{position:absolute;
  inset:0;
  background:#000;
  z-index:5;
  display:none;}
.yf-detail-video-layer.show{display:block;}
.yf-detail-video-layer iframe,.yf-detail-video-layer video{width:100%!important;height:100%!important;
  border:0!important;
  position:absolute!important;top:0!important;left:0!important;
  object-fit:contain!important;}
.yf-detail-video-bar{position:absolute;
  top:0;left:0;right:0;
  height:38px;
  background:linear-gradient(to bottom,rgba(0,0,0,.45),transparent);
  display:flex;
  align-items:center;
  
  
  }
.yf-detail-video-close{width:30px;height:30px;
  border:0;border-radius:50%;
  background:rgba(255,255,255,.25);
  color:#fff;
  font-size:18px;
  cursor:pointer;
  
  
  line-height:1;}
.yf-detail-video-error-close{position:absolute;
  
  width:52px;height:52px;
  border:2px solid rgba(255,255,255,.7);border-radius:50%;
  background:rgba(0,0,0,.45);
  color:#fff;font-size:28px;
  cursor:pointer;
  display:none;
  align-items:center;justify-content:center;
  line-height:1;}
.yf-detail-video-switch{border:0;border-radius:12px;
  background:rgba(255,255,255,.2);
  color:#fff;
  font-size:11px;
  font-weight:600;
  padding:4px 10px;
  cursor:pointer;
  white-space:nowrap;}
.yf-detail-thumbs-wrap{position:relative;
  overflow:hidden;}
.yf-detail-thumbs{display:flex;
  /* JITTER-FIX: 预留缩略图行高度(缩略图固定67px高)。缩略图由JS异步填充，
     容器空时若不占高会在填充后从~2px长到67px，撑高gallery列并把下方描述区顶下移，产生抖动。
     预留后容器从首帧即占最终高度，缩略图加载不再改变布局。仅预留空间，不影响功能。 */
  min-height:67px;

  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  cursor:grab;
  user-select:none;}
.yf-detail-thumbs.dragging{cursor:grabbing;}
.yf-detail-thumbs::-webkit-scrollbar{display:none;}
.yf-detail-thumbs img{
  
  object-fit:cover;
  background:transparent;
  cursor:pointer;
  border-radius:0!important;
  
  
  flex-shrink:0;
  
  }
.yf-detail-info{background:#fff;
  margin-top:3px;}
.yf-detail-info h1{margin:0;
  padding:0.875rem 0.625rem 0.8125rem;
  font-size:1.125rem;
  line-height:1.22;
  font-weight:800;
  border-bottom:1px solid #eee;
  letter-spacing:-.3px;}
.yf-detail-price{display:flex;
  background:#f7f6f4;
  border-bottom:1px solid #eee;}
.yf-detail-price-item{flex:1;
  
  
  border-right:1px solid rgba(0,0,0,.06);}
.yf-detail-price-item:last-child{border-right:0;}
.yf-detail-price-item strong{display:block;
  color:#ff6a00;
  
  
  }
.yf-detail-price{padding:0 6px;}
.yf-detail-price-item{padding:13px 2px 12px;}
.yf-detail-price-item span{display:block;
  
  color:#777;
  font-weight:600;}
.yf-detail-price-item span b{color:#777;
  font-weight:600;}
.yf-detail-price-item span em{color:#777;
  font-weight:400;
  font-style:normal;}
.yf-detail-price-item span b em,.yf-basic-val b em{color:inherit!important;
  font-weight:inherit!important;
  font-style:normal!important;}
.yf-detail-basic{display:grid;
  grid-template-columns:1fr 1fr 1fr;
  padding:0.75rem 0.625rem;
  background:#f7f6f4;
  border-bottom:1px solid #eee;
  font-size:0.8125rem;
  color:#111;}
.yf-detail-basic > div:first-child{text-align:left;
  overflow:hidden;}
.yf-detail-basic > div:nth-child(2){text-align:center;
  overflow:hidden;}
.yf-detail-basic > div:last-child{text-align:center;
  overflow:hidden;}
.yf-detail-basic > div > span{color:#777;
  font-weight:600;
  font-style:normal;}
.yf-detail-basic em{color:#111;
  font-weight:400;
  font-style:normal;}
.yf-detail-basic b{color:#111;
  font-weight:600;}
.yf-basic-val{white-space:nowrap;}
/* QT-186: canonical specification layout. This is the only rule set that
   controls name/value geometry; old flex and language-specific overrides were removed. */
.yf-detail-specs{display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));}
.yf-detail-specs > div{min-height:2.625rem;
  padding:0.625rem 0.75rem;
  font-size:0.75rem;
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  align-items:start;
  column-gap:10px;
  border-bottom:1px solid #eee;}
.yf-detail-specs > div:nth-child(odd){border-right:1px solid #eee;}
.yf-detail-specs > div > span:first-child{grid-column:1;
  min-width:max-content;
  max-width:none;
  margin:0;
  color:#888;
  font-weight:400;
  line-height:1.3;
  text-align:left;
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;}
.yf-detail-specs > div > .yf-spec-val{grid-column:2;
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:0;
  color:#111;
  line-height:1.3;
  text-align:right;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;}
.yf-detail-specs > div > .yf-spec-val b{color:#111;
  font-weight:700;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;}
.yf-detail-specs > div > .yf-spec-val em{color:#111;
  font-weight:500;
  font-style:normal;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;}
html.yf-lang-ar body .yf-detail-page .yf-detail-specs > div,
body.yf-lang-ar .yf-detail-page .yf-detail-specs > div{direction:ltr;
  grid-template-columns:minmax(0,1fr) max-content;}
html.yf-lang-ar body .yf-detail-page .yf-detail-specs > div > span:first-child,
body.yf-lang-ar .yf-detail-page .yf-detail-specs > div > span:first-child{grid-column:2;
  direction:rtl;
  unicode-bidi:plaintext;
  text-align:right;}
html.yf-lang-ar body .yf-detail-page .yf-detail-specs > div > .yf-spec-val,
body.yf-lang-ar .yf-detail-page .yf-detail-specs > div > .yf-spec-val{grid-column:1;
  direction:ltr;
  unicode-bidi:isolate;
  text-align:left;}
@media (max-width:767px){.yf-detail-specs div{min-height:2.75rem !important;
    padding:0.625rem 0.625rem !important;
    font-size:0.8125rem !important;}
.yf-detail-specs > div > span{font-size:0.8125rem !important;
    font-weight:500 !important;}
.yf-spec-val b,.yf-spec-val em{font-size:0.875rem !important;}}
.yf-detail-about{background:#f7f6f4;
  padding:6px;
  margin-top:4px;
  box-sizing:border-box;
  line-height:1.65;}
.yf-detail-about h2{margin:0 0 6px;
  font-size:1rem;
  font-weight:700;
  color:#3a4a5c;}
.yf-detail-section-title{margin:8px 0 6px!important;
  font-size:1rem!important;
  line-height:1.25!important;
  font-weight:700!important;
  color:#3a4a5c!important;}
.yf-detail-info .yf-detail-section-title{background:transparent!important;
  padding:0!important;}
.yf-detail-images h2{margin:0 0 6px!important;
  padding:6px 6px 0!important;
  font-size:1rem!important;
  line-height:1.25!important;
  font-weight:700!important;
  color:#3a4a5c!important;
  background:#f7f6f4!important;}
.yf-detail-about p{margin:0;
  font-size:0.8125rem;
  line-height:1.65;
  color:#555;}
.yf-detail-images{line-height:0;
  background:#fff;}
.yf-detail-images img{width:100%;
  display:block;
  object-fit:cover;
  border-radius:0!important;
  margin-bottom:3px;}
.yf-detail-images img:last-child{margin-bottom:0;}
.yf-lightbox{position:fixed;
  inset:0;
  background:#000;
  z-index:30000;
  display:none;
  align-items:center;
  justify-content:center;}
.yf-lightbox.show{display:flex;}
#yfLightboxStage{display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  overflow:hidden;}
#yfLightboxStage img{max-width:100%;
  max-height:100vh;
  object-fit:contain;
  transform-origin:center center;
  transition:transform .15s ease-out;
  pointer-events:auto;}
.yf-lightbox-prev,.yf-lightbox-next{position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border:0;
  background:rgba(255,255,255,.15);
  color:#fff;
  border-radius:50%;
  font-size:28px;
  cursor:pointer;
  z-index:1;}
.yf-lightbox-prev{left:12px;}
.yf-lightbox-next{right:12px;}
.yf-lightbox-close{position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  border:0;
  background:rgba(255,255,255,.15);
  color:#fff;
  border-radius:50%;
  font-size:18px;
  line-height:36px;
  cursor:pointer;}
@media (min-width:768px){.yf-sheet.sheet-contact{max-height:calc(100vh - 58px)!important;
    min-height:0!important;
    height:auto!important;}
.yf-sheet.sheet-contact .yf-contact-body{overflow:visible!important;
    padding-bottom:10px!important;}
.yf-sheet.sheet-contact .yf-contact-scroll{flex:1 1 auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    padding-bottom:0!important;}
.yf-sheet.sheet-contact .yf-contact-row{padding:7px 10px!important;
    margin-bottom:5px!important;}
.yf-sheet.sheet-contact .yf-contact-row small{margin-bottom:2px!important;}
.yf-sheet.sheet-contact .yf-contact-wa{display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:42px!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:10px 10px!important;}
.yf-sheet.sheet-contact .yf-contact-actions{padding-top:8px!important;}}
@media (max-width:767px){.yf-detail-arrow{display:none!important;}

.yf-detail-basic{grid-template-columns:1fr 1fr 1fr;
    gap:4px;
    }
.yf-detail-basic > div{align-items:center!important;
    text-align:center!important;}

.yf-detail-basic > div:last-child{padding-right:0px;
  transform:translateX(-7px);}
.yf-detail-basic > div > b,.yf-detail-basic > div > em{font-size:0.6875rem;}
.yf-detail-info{margin-top:2px!important;}
.yf-detail-page{overflow-x:hidden;}
.yf-sheet.sheet-center{left:8px!important;
    right:8px!important;
    width:auto!important;
	    bottom:48px!important;
    max-height:78vh!important;
    height:auto!important;
    border-radius:12px 12px 0 0!important;}
.yf-sheet.sheet-center .yf-sheet-body{max-height:calc(78vh - 42px)!important;
	    overflow-y:auto!important;
	    padding-bottom:18px!important;}
.yf-sheet.sheet-center .yf-contact-body{overflow:hidden!important;
	    padding-bottom:10px!important;}
.yf-sheet.sheet-cat{left:6px!important;
    right:auto!important;
    width:auto!important;
    max-width:calc(100vw - 12px)!important;
    bottom:50px!important;
    border-radius:10px 10px 0 0!important;}
.yf-cat-col-l1{min-width:112px!important;
    width:112px!important;}
.yf-cat-col-l2{min-width:112px!important;
    width:112px!important;}
.yf-cat-col-l3{min-width:112px!important;
    width:112px!important;}
}
@media (max-width:767px){.yf-detail-basic > div > span{font-size:0.8125rem !important;
    font-weight:700 !important;
    color:#666 !important;
    margin-bottom:2px !important;}
.yf-detail-basic > div > b,.yf-detail-basic > div > em,.yf-basic-val,.yf-basic-val b,.yf-basic-val em{font-size:0.8125rem !important;
    font-weight:700 !important;
    color:#111 !important;}
.yf-detail-basic{padding:0.5rem 0.75rem !important;}
.yf-detail-basic > div:nth-child(2){padding-left:18px !important;}
.yf-detail-basic > div:nth-child(3){padding-left:40px !important;}
.yf-basic-val{display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:2px !important;
    white-space:nowrap !important;
    overflow:visible !important;
    transform:none !important;}
.yf-detail-basic > div:nth-child(3) > span:first-child{transform:translateX(-8px) !important;}}
@media (min-width:768px){
.yf-detail-page{max-width:960px;
    margin:0 auto;
    padding:42px 0 0!important;
    min-height:0;}
.yf-detail-content{display:grid;
    grid-template-columns:calc(52% - 3px) calc(48% - 3px);
    gap:6px;
    align-items:start;
    padding:0;}
.yf-detail-info{margin-top:0;}
.yf-detail-arrow{display:flex;}

.yf-top{display:none;}
.yf-bottom{left:50%!important;
    right:auto!important;
    bottom:0!important;
    width:100%!important;
    max-width:960px!important;
    transform:translateX(-50%)!important;
    margin:0 auto!important;
    border-radius:6px 6px 0 0;}
.yf-sheet.sheet-center{left:auto;
    right:auto;
    bottom:50px;}
.yf-sheet.sheet-right,.yf-sheet.sheet-cat{right:auto;
    bottom:50px;
    border-radius:10px;
    box-shadow:0 4px 20px rgba(0,0,0,.12);}
.yf-sheet.sheet-cat{width:auto!important;
    max-width:400px!important;}}



.yf-thumb-arrow-wrap{position:relative!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;}
.yf-thumb-arrow-wrap .yf-detail-thumbs,.yf-thumb-arrow-wrap #yfDetailThumbs{flex:1 1 auto!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scroll-behavior:smooth!important;}
.yf-thumb-arrow{flex:0 0 22px!important;
  
  
  border:0!important;
  
  background:rgba(255,106,0,.92)!important;


  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  z-index:2!important;}
.yf-detail-info.yf-info-stretch{display:flex!important;
  flex-direction:column!important;}
.yf-detail-info.yf-info-stretch .yf-detail-interest{margin-top:0!important;}
@media (max-width:768px){.yf-thumb-arrow{height:48px!important;
    width:20px!important;
    flex-basis:20px!important;}}

.yf-interest-item{


  background:#fff!important;
  border:1px solid #e2e5e9!important;
  border-radius:8px!important;
  }
.yf-interest-check{flex:0 0 auto!important;
  width:18px!important;
  height:18px!important;
  }
.yf-interest-img{
  
  object-fit:cover!important;
  border-radius:6px!important;
  cursor:pointer!important;
  flex:0 0 auto!important;
  border:1px solid #eee!important;
  }
.yf-interest-item h3,.yf-interest-item .title{display:none!important;}
.yf-interest-spacer{
  min-width:18px!important;}
.yf-interest-del{flex:0 0 auto!important;
  width:28px!important;
  height:28px!important;
  border:0!important;
  border-radius:50%!important;
  background:#eeeeee!important;
  color:#8b8b8b!important;
  font-size:18px!important;
  line-height:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  
  }


.yf-interest-send-merchant{background:#25d366!important;
  color:#fff!important;}
.yf-interest-share-friend{background:#ff6a00!important;
  color:#fff!important;}
.yf-interest-preview-mask{position:fixed!important;
  inset:0!important;
  z-index:100001!important;
  background:rgba(0,0,0,.58)!important;
  display:none!important;}
.yf-interest-preview-mask.show{display:block!important;}
.yf-interest-preview-box{position:absolute!important;
  top:50%!important;
  left:50%!important;
  transform:translate(-50%,-50%)!important;
  width:auto!important;
  max-width:94vw!important;
  max-height:92vh!important;
  overflow:auto!important;
  background:#fff!important;
  border-radius:10px!important;
  box-shadow:0 12px 36px rgba(0,0,0,.28)!important;
  padding:10px!important;}
.yf-interest-preview-close{position:absolute!important;
  top:8px!important;
  right:8px!important;
  width:30px!important;
  height:30px!important;
  border:0!important;
  border-radius:50%!important;
  background:rgba(255,106,0,.95)!important;
  color:#fff!important;
  font-size:20px!important;
  line-height:30px!important;
  z-index:2!important;}
.yf-interest-preview-content{padding:0!important;}
.yf-interest-preview-content img{max-width:90vw!important;
  max-height:86vh!important;
  display:block!important;
  margin:0 auto!important;
  border-radius:8px!important;}

@media (max-width:480px){
.yf-interest-img{width:54px!important;
    height:54px!important;}
.yf-interest-del{margin-right:2px!important;}}
#yfLightbox .dot,#yfLightbox .dots,#yfLightbox .yf-dot,#yfLightbox .yf-dots{animation:none!important;
  transform:none!important;
  transition:opacity .12s ease, background-color .12s ease!important;}

#yfLightbox .yf-lightbox-prev,#yfLightbox .yf-lightbox-next,.yf-lightbox-prev,.yf-lightbox-next{animation:none!important;
  transition:transform .08s ease!important;}

.yf-lightbox-prev{left:4px!important;}
.yf-lightbox-next{right:4px!important;}
.yf-thumb-arrow{background:#eeeeee!important;
  color:#111!important;
  border-radius:0!important;
  width:16px!important;
  flex-basis:16px!important;
  height:66px!important;
  font-size:0!important;
  font-weight:400!important;
  line-height:1!important;
  box-shadow:none!important;
  position:relative!important;}
.yf-thumb-arrow.left::before{content:""!important;}
.yf-thumb-arrow.right::before{content:""!important;}
.yf-thumb-arrow::before,.yf-thumb-arrow::after{content:""!important;
  position:absolute!important;
  top:50%!important;
  width:10px!important;
  height:1.5px!important;
  background:#222!important;
  border:0!important;
  border-radius:999px!important;
  display:block!important;}
.yf-thumb-arrow.left::before,.yf-thumb-arrow.left::after{left:4px!important;
  transform-origin:left center!important;}
.yf-thumb-arrow.left::before{transform:translateY(-50%) rotate(60deg)!important;}
.yf-thumb-arrow.left::after{transform:translateY(-50%) rotate(-60deg)!important;}
.yf-thumb-arrow.right::before,.yf-thumb-arrow.right::after{right:4px!important;
  transform-origin:right center!important;}
.yf-thumb-arrow.right::before{transform:translateY(-50%) rotate(60deg)!important;}
.yf-thumb-arrow.right::after{transform:translateY(-50%) rotate(-60deg)!important;}

@media (max-width:480px){.yf-thumb-arrow{width:15px!important;
    flex-basis:15px!important;
    height:74px!important;}}
.yf-detail-desc img,.yf-detail-content img{display:block!important;
  margin-top:3px!important;
  margin-bottom:3px!important;
  border-top:3px solid #fff!important;
  border-bottom:3px solid #fff!important;
  box-sizing:border-box!important;}
.yf-detail-info,.yf-detail-price{background:#f9fafb!important;}
.yf-detail-price{border-top:0!important;
  border-bottom:0!important;}


.yf-interest-item{width:64%!important;
  max-width:400px!important;
  height:auto!important;
  min-height:0!important;
  margin:0 auto 8px!important;
  padding:4px 10px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  box-sizing:border-box!important;}
.yf-interest-check{margin:0 6px 0 0!important;}
.yf-interest-img{width:56px!important;
  height:56px!important;
  margin-left:2px!important;}
.yf-interest-spacer{flex:1 1 auto!important;}
.yf-interest-del{margin-left:auto!important;
  margin-right:4px!important;}

@media (max-width:480px){.yf-interest-item{width:100%!important;}
.yf-interest-item{padding-top:4px!important;
    padding-bottom:4px!important;}}
.yf-sheet.sheet-interest{max-width:calc(100vw - 24px)!important;}
.yf-sheet.sheet-interest .yf-sheet-body{padding-left:8px!important;
  padding-right:8px!important;}
@media (max-width:767px){.yf-sheet.sheet-interest.sheet-center{left:50%!important;
    right:auto!important;
    max-width:calc(100vw - 24px)!important;
    bottom:48px!important;
    transform:translate(-50%,110vh)!important;}
.yf-sheet.sheet-interest.sheet-center.show{transform:translate(-50%,0)!important;}}
.yf-detail-gallery .yf-detail-main-img,.yf-detail-gallery .yf-detail-thumbs img{margin-top:0!important;
  margin-bottom:0!important;
  border-top:0!important;
  border-bottom:0!important;}
.yf-detail-thumbs-wrap,.yf-thumb-arrow-wrap{margin-top:0!important;}
.yf-detail-thumbs{gap:3px!important;
  margin-top:0!important;
  padding:0 1px!important;
  overflow-x:auto!important;
  overflow-y:visible!important;}
.yf-thumb-arrow-wrap .yf-detail-thumbs,.yf-thumb-arrow-wrap #yfDetailThumbs{align-items:center!important;}
.yf-detail-thumbs img{width:66px!important;
  height:66px!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  background:transparent!important;
  flex:0 0 auto!important;
  display:block!important;}
.yf-detail-thumbs img.sel{outline:2px solid #ff6a00!important;
  outline:0!important;
  outline-offset:0!important;
  box-shadow:inset 0 0 0 1px #ff6a00!important;}
.yf-thumb-arrow.left{margin-right:3px!important;}
.yf-thumb-arrow.right{margin-left:3px!important;}
@media (max-width:767px){.yf-lightbox-prev,.yf-lightbox-next{width:38px!important;
    height:38px!important;
    border-radius:50%!important;
    background:#000!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:0 2px 10px rgba(0,0,0,.24)!important;
    font-size:0!important;
    line-height:0!important;
    opacity:1!important;
    animation:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    position:absolute!important;
    transform:translateY(-50%)!important;
    transition:transform .08s ease!important;}
.yf-lightbox-prev::before,.yf-lightbox-prev::after,.yf-lightbox-next::before,.yf-lightbox-next::after{content:""!important;
    position:absolute!important;
    top:50%!important;
    width:11px!important;
    height:2px!important;
    background:#fff!important;
    border-radius:999px!important;
    display:block!important;}
.yf-lightbox-prev::before,.yf-lightbox-prev::after{left:50%!important;
    transform-origin:left center!important;}
.yf-lightbox-prev::before{transform:translate(-5px,-50%) rotate(43deg)!important;}
.yf-lightbox-prev::after{transform:translate(-5px,-50%) rotate(-43deg)!important;}
.yf-lightbox-next::before,.yf-lightbox-next::after{right:50%!important;
    transform-origin:right center!important;}
.yf-lightbox-next::before{transform:translate(5px,-50%) rotate(43deg)!important;}
.yf-lightbox-next::after{transform:translate(5px,-50%) rotate(-43deg)!important;}

.yf-lightbox-prev{left:10px!important;}
.yf-lightbox-next{right:4px!important;}
.yf-lightbox-close{top:52px!important;
    right:14px!important;
    width:40px!important;
    height:40px!important;
    border-radius:50%!important;
    background:#000!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.28)!important;
    box-shadow:0 2px 10px rgba(0,0,0,.24)!important;
    font-size:22px!important;
    line-height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:4!important;}
.yf-detail-thumbs{gap:3px!important;}
.yf-detail-thumbs img{width:68px!important;
    height:68px!important;}}
@media (min-width:768px){.yf-bottom,.yf-bottom.yf-bottom-hidden,.yf-bottom.yf-bottom-dimmed{opacity:1!important;
    pointer-events:auto!important;}}



.yf-drawer.yf-main-nav-drawer{
  
  border-radius:10px!important;
  background:#fff!important;
  box-shadow:0 4px 16px rgba(0,0,0,.10)!important;
  overflow:hidden!important;}
.yf-drawer.yf-main-nav-drawer button{
  
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  
  border:0!important;
  border-bottom:1px solid #f0f0f0!important;


  font-weight:600!important;
  }
.yf-drawer.yf-main-nav-drawer button:last-child{border-bottom:0!important;}
.yf-drawer.yf-main-nav-drawer button span{flex:1 1 auto!important;
  min-width:0!important;
  text-align:left!important;
  white-space:nowrap!important;}
.yf-drawer.yf-main-nav-drawer svg{width:14px!important;
  height:14px!important;
  flex:0 0 14px!important;
  stroke:#ff6a00!important;
  color:#ff6a00!important;
  fill:none!important;
  stroke-width:1.85!important;}
.yf-bottom{display:none!important;}
.yf-sheet.yf-cat-top-panel{position:fixed!important;
  left:0!important;
  right:auto!important;
  bottom:auto!important;


  -webkit-overflow-scrolling:touch!important;
  z-index:20001!important;
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .18s ease, transform .22s ease!important;}
.yf-sheet.yf-cat-top-panel.show{opacity:1!important;
  transform:translateY(0)!important;}

.yf-backdrop.yf-cat-top-backdrop{background:transparent!important;}
@media (max-width:767px){.yf-detail-page{--yf-detail-nav-item-height:30px; padding-bottom:18px!important;}


.yf-drawer.yf-main-nav-drawer{min-width:134px!important;width:134px!important;}
}
@media (min-width:768px){.yf-bottom{display:none!important;}}
@media (max-width:767px){
  /* RELEASE-056: align the mobile Contact Us sheet bottom edge with About Us. */
  .yf-sheet.sheet-contact{bottom:48px!important;}
  .yf-sheet.sheet-interest{bottom:0!important;}
  .yf-sheet.sheet-contact,.yf-sheet.sheet-interest{border-radius:14px 14px 0 0!important;}
}
@media (min-width:768px){.yf-drawer.yf-main-nav-drawer{
    transform:none!important;}}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn{


  cursor:pointer!important;


  }
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.sel,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.sel{color:#ff6a00!important;
  background:rgba(255,106,0,.07)!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l3{color:#111!important;
  font-weight:650!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l3.sel{color:#111!important;
  background:transparent!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3:hover{background:rgba(0,0,0,.035)!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{content:"▶"!important;
  
  font-size:10px!important;


  }
.yf-sheet.yf-cat-top-panel .yf-cat-col-l2 .yf-cat-item-l2.has-child::after{margin-left:8px!important;}
@media (max-width:767px){.yf-sheet.yf-cat-top-panel{
    border-radius:0 10px 10px 0!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn{
    
    
    white-space:nowrap!important;
    word-break:normal!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{border-top-width:4px!important;
    border-bottom-width:4px!important;
    border-left-width:6px!important;
    margin-left:6px!important;}}
.yf-sheet.sheet-interest{display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;}
.yf-sheet.sheet-interest .yf-sheet-head{flex:0 0 auto!important;
  background:#fff!important;
  border-bottom:1px solid #eee!important;}
.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body{flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#fff!important;
  padding:10px!important;}

.yf-sheet.sheet-interest .yf-interest-scroll{flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  
  }

.yf-sheet.sheet-interest .yf-interest-item{width:100%!important;
  max-width:260px!important;


  background:#f7f7f7!important;


  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-item:last-child{margin-bottom:0!important;}
.yf-sheet.sheet-interest .yf-interest-check{width:18px!important;
  height:18px!important;
  margin:0!important;
  flex:0 0 auto!important;
  accent-color:#ff6a00!important;}
.yf-sheet.sheet-interest .yf-interest-img{width:56px!important;
  height:56px!important;
  margin:0!important;
  border-radius:8px!important;
  object-fit:cover!important;
  flex:0 0 auto!important;
  background:#fff!important;}
.yf-sheet.sheet-interest .yf-interest-spacer{flex:1 1 auto!important;
  min-width:0!important;}
.yf-sheet.sheet-interest .yf-interest-del{
  
  margin:0!important;
  
  
  background:#e9e9e9!important;
  
  
  font-weight:800!important;


  cursor:pointer!important;
  }
.yf-sheet.sheet-interest .yf-interest-send-merchant,.yf-sheet.sheet-interest .yf-interest-share-friend{width:100%!important;
  min-height:44px!important;
  margin:0 0 8px!important;
  border:0!important;
  border-radius:10px!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:800!important;
  cursor:pointer!important;}
.yf-sheet.sheet-interest .yf-interest-share-friend{margin-bottom:0!important;}
.yf-sheet.sheet-interest .yf-interest-download{width:100%!important;
  min-height:40px!important;
  border:0!important;
  border-radius:10px!important;
  background:#ff6a00!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:700!important;
  cursor:pointer!important;
  margin:4px 0 0!important;}
@media (min-width:768px){.yf-sheet.sheet-interest{
    max-width:calc(100vw - 24px)!important;}
.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body{padding:14px!important;}}
@media (max-width:767px){.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body{padding:12px!important;}}
.yf-sheet .yf-sheet-close,.yf-sheet.sheet-interest .yf-interest-del{background:#e3e3e3!important;
  border:1px solid #d0d0d0!important;
  color:#555!important;
  box-shadow:0 2px 5px rgba(0,0,0,.10)!important;}
.yf-sheet .yf-sheet-close{width:32px!important;
  height:32px!important;
  font-size:20px!important;
  font-weight:800!important;
  line-height:1!important;}
.yf-sheet .yf-sheet-close:active,.yf-sheet.sheet-interest .yf-interest-del:active{background:#d6d6d6!important;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.12)!important;}
.yf-contact-copy{background:rgba(255,255,255,.58)!important;
  border:1px solid rgba(255,106,0,.20)!important;
  color:#ff6a00!important;
  box-shadow:0 1px 3px rgba(0,0,0,.05)!important;
  font-weight:700!important;}
@media (min-width:768px){.yf-sheet.sheet-contact,.yf-sheet.sheet-interest{left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    max-width:calc(100vw - 24px)!important;}
.yf-sheet.sheet-contact.show,.yf-sheet.sheet-interest.show{transform:translateX(-50%)!important;}
.yf-sheet.sheet-contact{width:340px!important;
    border-radius:12px!important;}
.yf-sheet.sheet-interest{width:340px!important;
    border-radius:14px!important;}}
@media (max-width:767px){#yfWA.yf-wa,.yf-wa#yfWA{position:fixed!important;
    right:4px!important;
    left:auto!important;
    top:calc(40dvh - 21px)!important;
    bottom:auto!important;
    width:42px!important;
    height:42px!important;
    display:grid!important;
    opacity:0!important;
    pointer-events:none!important;
    transform:none!important;
    z-index:100002!important;
    touch-action:none!important;
    user-select:none!important;
    -webkit-user-select:none!important;
    -webkit-touch-callout:none!important;
    transition:opacity .18s ease!important;
    will-change:top,opacity!important;}
#yfWA.yf-wa.yf-wa-show,.yf-wa#yfWA.yf-wa-show{opacity:1!important;
    pointer-events:auto!important;
    top:calc(40dvh - 21px)!important;
    bottom:auto!important;
    transform:none!important;}
#yfWA.yf-wa.yf-wa-dragging,.yf-wa#yfWA.yf-wa-dragging{transition:none!important;}}
.yf-sheet.sheet-contact.yf-msg-form-open{overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;}
.yf-msg-form-body{display:flex!important;
  flex:0 1 auto!important;
  flex-direction:column!important;
  overflow:hidden!important;
  min-height:0!important;
  box-sizing:border-box!important;}
.yf-msg-form-scroll{flex:0 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  padding:0!important;
  box-sizing:border-box!important;}
.yf-msg-form-actions{flex:0 0 auto!important;
  padding-top:0!important;
  background:#fff!important;
  box-sizing:border-box!important;}
.yf-msg-form-actions .yf-msg-send-btn{display:block!important;
  width:100%!important;
  padding:12px!important;
  background:#ff6a00!important;
  color:#fff!important;
  border:0!important;
  border-radius:10px!important;
  font-size:16px!important;
  font-weight:800!important;
  cursor:pointer!important;
  box-sizing:border-box!important;}
.yf-msg-field{margin-bottom:8px!important;}
.yf-msg-field textarea,.yf-msg-field input{width:100%!important;
  padding:10px!important;
  border:1px solid #e0e0e0!important;
  border-radius:8px!important;
  font-size:16px!important;
  box-sizing:border-box!important;
  font-family:inherit!important;
  background:#fff!important;}
.yf-msg-field textarea{resize:vertical!important;
  min-height:92px!important;
  max-height:34vh!important;}
@media (max-width:767px){.yf-sheet.sheet-contact.yf-msg-form-open{left:8px!important;
    right:8px!important;
    width:auto!important;
    max-width:calc(100vw - 16px)!important;
    border-radius:12px!important;}
.yf-sheet.sheet-contact.yf-msg-form-open .yf-msg-form-body{max-height:none!important;
    padding-bottom:0!important;}
.yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head{flex:0 0 auto!important;}}
.yf-drawer.yf-main-nav-drawer{width:134px!important;
  min-width:134px!important;}
.yf-drawer.yf-main-nav-drawer button{min-height:34px!important;
  height:34px!important;
  padding:0 10px!important;
  font-size:13px!important;
  line-height:1!important;
  background:#fff!important;
  color:#ff6a00!important;}
.yf-sheet.yf-cat-top-panel{
  max-height:40vh!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
  }
.yf-sheet.yf-cat-top-panel::-webkit-scrollbar,
.yf-sheet.yf-cat-top-panel .yf-sheet-body::-webkit-scrollbar,
.yf-sheet.yf-cat-top-panel .yf-cat-wrap::-webkit-scrollbar,
.yf-sheet.yf-cat-top-panel .yf-cat-col::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}
.yf-sheet.yf-cat-top-panel .yf-sheet-body,
.yf-sheet.yf-cat-top-panel .yf-cat-wrap,
.yf-sheet.yf-cat-top-panel .yf-cat-col{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
.yf-sheet.yf-cat-top-panel .yf-cat-col{
  
  
  flex-shrink:0!important;
  padding-top:0!important;
  padding-bottom:2px!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1{width:132px!important;
  min-width:132px!important;
  padding:0 6px 0 0!important;
  border-right:1px solid #eee!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l2{width:132px!important;
  min-width:132px!important;
  padding:0 6px!important;
  border-right:1px solid #eee!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l3{width:142px!important;
  min-width:142px!important;
  padding:0 0 0 6px!important;
  border-right:0!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn{width:100%!important;
  min-height:30px!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:0!important;
  padding:5px 7px!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#111!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:1.2!important;
  text-align:left!important;
  white-space:nowrap!important;
  transform:none!important;
  opacity:1!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l1:active,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2:active,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3:active{background:transparent!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child span,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child span{
  flex:0 0 auto!important;
  
  overflow:hidden!important;
  text-overflow:ellipsis!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{


  color:currentColor!important;
  
  margin-right:0!important;
  
  float:none!important;
  position:static!important;
  transform:none!important;
  opacity:1!important;}
@media (max-width:767px){.yf-sheet.yf-cat-top-panel{max-width:calc(100vw - 8px)!important;
    max-height:42vh!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1{width:98px!important;
    min-width:98px!important;
    padding-right:5px!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l2{width:112px!important;
    min-width:112px!important;
    padding:0 5px!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l3{width:124px!important;
    min-width:124px!important;
    padding-left:5px!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn{min-height:29px!important;
    padding:5px 5px!important;
    font-size:13px!important;}}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1 .yf-cat-item-l1.has-child,.yf-sheet.yf-cat-top-panel .yf-cat-col-l2 .yf-cat-item-l2.has-child{position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  padding-right:16px!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1 .yf-cat-item-l1.has-child span,.yf-sheet.yf-cat-top-panel .yf-cat-col-l2 .yf-cat-item-l2.has-child span{flex:0 0 auto!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1 .yf-cat-item-l1.has-child::after,.yf-sheet.yf-cat-top-panel .yf-cat-col-l2 .yf-cat-item-l2.has-child::after{content:""!important;
  display:block!important;
  width:0!important;
  height:0!important;
  border-top:4px solid transparent!important;
  border-bottom:4px solid transparent!important;
  border-left:6px solid #ff6a00!important;
  margin-left:6px!important;
  flex:0 0 auto!important;
  opacity:1!important;
  background:transparent!important;}

.yf-detail-page.yf-detail-preparing .yf-detail-content,.yf-detail-page.yf-detail-preparing .yf-detail-about,.yf-detail-page.yf-detail-preparing .yf-detail-images{visibility:hidden!important;
  opacity:0!important;}
.yf-detail-page .yf-detail-basic{border-top:1px solid #e5e5e5!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-detail-action-split,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{display:flex!important;
  flex-direction:row!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  width:100%!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  background:#ff6a00!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg{flex:1 1 50%!important;
  width:50%!important;
  max-width:50%!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#ff6a00!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  text-align:center!important;
  cursor:pointer!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  box-shadow:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg{border-left:1px solid rgba(255,255,255,.55)!important;}
.yf-product-msg-mask{display:none;position:fixed;inset:0;z-index:100001;background:rgba(0,0,0,.38);align-items:center;justify-content:center;padding:14px;box-sizing:border-box;}
.yf-product-msg-mask.show{display:flex!important;}
.yf-product-msg-box{width:min(430px,92vw);background:#fff;border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.25);overflow:hidden;display:flex;flex-direction:column;position:relative;max-height:calc(100dvh - 28px);}
.yf-product-msg-head{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid #edf1f5;font-size:15px;font-weight:900;color:#111827;flex:0 0 auto;}
.yf-product-msg-close{width:30px;height:30px;border:0;border-radius:50%;background:#f1f3f5;color:#333;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;padding:0;}
.yf-product-msg-body{padding:12px;overflow:visible;-webkit-overflow-scrolling:auto;}
.yf-product-msg-product{display:flex;gap:10px;align-items:center;margin-bottom:10px;background:#f8fafc;border:1px solid #edf1f5;border-radius:8px;padding:8px;}
.yf-product-msg-product img{width:58px;height:58px;object-fit:cover;border-radius:6px;background:#f3f4f6;flex:0 0 58px;}
.yf-product-msg-title{font-size:13px;font-weight:800;line-height:1.35;color:#111827;max-height:38px;overflow:hidden;}
.yf-product-msg-url{font-size:11px;color:#64748b;line-height:1.25;margin-top:3px;word-break:break-all;max-height:28px;overflow:hidden;}
.yf-product-msg-contact-wrap{margin:8px 0 8px;}
.yf-product-msg-contact-label{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:800;color:#1f2937;margin:0 0 5px;}
.yf-product-msg-contact-label b{color:#ef4444;font-size:14px;}
.yf-product-msg-contact{width:100%;height:42px;border:1px solid #cbd5e1;border-radius:8px;padding:0 10px;font-size:16px!important;line-height:42px;box-sizing:border-box;outline:none;background:#fff;-webkit-text-size-adjust:100%;}
.yf-product-msg-contact.is-error{border-color:#ef4444!important;box-shadow:0 0 0 2px rgba(239,68,68,.12)!important;}
.yf-product-msg-error{min-height:18px;font-size:12px;line-height:18px;color:#ef4444;margin-top:3px;}
.yf-product-msg-body textarea{width:100%;min-height:96px;resize:none;border:1px solid #dbe2ea;border-radius:8px;padding:9px 10px;font-size:16px!important;line-height:1.45;box-sizing:border-box;outline:none;-webkit-text-size-adjust:100%;}
.yf-product-msg-contact:focus,.yf-product-msg-body textarea:focus{border-color:#ff6a00;box-shadow:0 0 0 2px rgba(255,106,0,.12);}
.yf-product-msg-actions{display:flex;gap:8px;margin-top:10px;}
.yf-product-msg-actions button{flex:1;height:38px;border-radius:8px;border:0;font-size:14px;font-weight:900;cursor:pointer;}
.yf-product-msg-send{background:#ff6a00;color:#fff;}
.yf-product-msg-cancel{background:#eef2f7;color:#334155;}
.yf-product-msg-alert{position:absolute;inset:0;z-index:5;background:rgba(255,255,255,.62);display:flex;align-items:center;justify-content:center;padding:18px;box-sizing:border-box;}
.yf-product-msg-alert-card{width:min(320px,86%);background:#fff;border-radius:12px;box-shadow:0 12px 36px rgba(0,0,0,.24);border:1px solid #f1d2c1;padding:18px 16px;text-align:center;}
.yf-product-msg-alert-text{font-size:15px;line-height:1.45;font-weight:800;color:#1f2937;margin-bottom:14px;}
.yf-product-msg-alert-ok{height:38px;min-width:92px;border:0;border-radius:8px;background:#ff6a00;color:#fff;font-size:15px;font-weight:900;padding:0 18px;}
@media (max-width:767px){.yf-product-msg-mask{align-items:center!important;justify-content:center!important;padding:8px!important;}
.yf-product-msg-box{width:96vw;border-radius:14px;max-height:none!important;transform:none!important;}
.yf-product-msg-head{height:38px;font-size:14px;padding:0 10px;}
.yf-product-msg-close{width:28px;height:28px;font-size:18px;}
.yf-product-msg-body{padding:9px 10px 10px!important;overflow:visible!important;max-height:none!important;}
.yf-product-msg-product{gap:8px;margin-bottom:7px;padding:6px;}
.yf-product-msg-product img{width:42px;height:42px;flex-basis:42px;}
.yf-product-msg-title{font-size:12px;line-height:1.25;max-height:30px;}
.yf-product-msg-url{display:none;}
.yf-product-msg-contact-wrap{margin:6px 0 6px;}
.yf-product-msg-contact-label{font-size:12px;margin-bottom:4px;}
.yf-product-msg-contact{height:38px;line-height:38px;font-size:16px!important;border-radius:8px;}
.yf-product-msg-error{min-height:16px;font-size:11px;line-height:16px;margin-top:2px;}
.yf-product-msg-body textarea{min-height:74px!important;font-size:16px!important;line-height:1.38;resize:none;}
.yf-product-msg-actions{margin-top:8px;gap:7px;}
.yf-product-msg-actions button{height:36px;font-size:14px;}
.yf-product-msg-alert{padding:14px;}
.yf-product-msg-alert-card{padding:15px 14px;}}
.yf-sheet.yf-cat-top-panel{width:max-content!important;
  min-width:0!important;
  max-width:calc(100vw - 8px)!important;
  max-height:calc(100dvh - 96px)!important;
  overflow:visible!important;
  background:#fff!important;
  border-radius:0 10px 10px 0!important;
  box-shadow:0 4px 20px rgba(0,0,0,.14)!important;}
.yf-sheet.yf-cat-top-panel .yf-sheet-body{padding:6px 7px!important;
  overflow:visible!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-wrap{display:flex!important;
  flex-direction:row!important;
  align-items:flex-start!important;
  gap:0!important;
  width:max-content!important;
  min-width:0!important;
  max-width:calc(100vw - 8px)!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  -webkit-overflow-scrolling:touch!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col{display:flex!important;
  flex-direction:column!important;
  gap:1px!important;
  flex:0 0 auto!important;
  width:max-content!important;
  min-width:max-content!important;
  max-width:none!important;
  padding:0 4px!important;
  border-right:1px solid #f2f2f2!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col:last-child{border-right:0!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3{display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  width:100%!important;
  min-width:max-content!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 9px!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#111!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:30px!important;
  text-align:left!important;
  white-space:nowrap!important;
  cursor:pointer!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-all-btn,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn.sel,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active{display:block!important;
  width:auto!important;
  min-width:max-content!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 9px!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#111!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:30px!important;
  text-align:left!important;
  white-space:nowrap!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.sel,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.sel,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3.sel{background:transparent!important;
  box-shadow:none!important;
  color:#ff6a00!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child{display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child span,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child span{display:inline-block!important;
  flex:0 0 auto!important;
  width:var(--yf-cat-label-width,auto)!important;
  min-width:var(--yf-cat-label-width,0px)!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{content:""!important;
  display:inline-block!important;
  flex:0 0 auto!important;
  width:0!important;
  height:0!important;
  margin-left:6px!important;
  border-top:4px solid transparent!important;
  border-bottom:4px solid transparent!important;
  border-left:6px solid #ff6a00!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-item-l1:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l2:hover,.yf-sheet.yf-cat-top-panel .yf-cat-item-l3:hover{background:#fafafa!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover{background:transparent!important;}
.yf-detail-hero.video-entry .yf-detail-main-img{display:block!important;
  object-fit:cover!important;}
.yf-detail-video-overlay{background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;}
.yf-detail-video-overlay::before{content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.18);
  pointer-events:none;}
.yf-detail-video-overlay .yf-detail-video-play-btn,.yf-detail-video-play-btn{position:relative!important;
  z-index:2!important;}
.yf-detail-thumb-video{background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-color:#222!important;}
.yf-detail-thumb-video::before{content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.22);
  pointer-events:none;}
.yf-detail-thumb-video::after{position:relative!important;
  z-index:2!important;}
.yf-detail-hero.video-playing .yf-detail-arrow{z-index:8!important;
  opacity:1!important;
  display:flex!important;
  pointer-events:auto!important;}
.yf-detail-hero.video-playing .yf-detail-prev{left:8px!important;}
.yf-detail-hero.video-playing .yf-detail-next{right:8px!important;}
@media (max-width:767px){

.yf-detail-hero.video-playing .yf-detail-arrow{display:flex!important;
    width:38px!important;
    height:38px!important;
    background:rgba(0,0,0,.55)!important;
    color:#fff!important;
    border:1px solid rgba(255,255,255,.28)!important;}
.yf-detail-video-error-close,.yf-detail-video-close,.yf-lightbox-close{right:14px!important;
    left:auto!important;}}
.yf-sheet.sheet-contact .yf-contact-scroll,.yf-sheet.sheet-interest .yf-interest-item{width:100%!important;
  max-width:260px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-scroll{
  
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  }
.yf-sheet.sheet-contact .yf-contact-actions{
  
  margin-left:auto!important;
  margin-right:auto!important;


  padding-top:8px!important;
  padding-bottom:0!important;
  }
.yf-sheet.sheet-contact .yf-contact-wa,.yf-sheet.sheet-contact .yf-msg-btn,.yf-sheet.sheet-interest .yf-interest-send-merchant,.yf-sheet.sheet-interest .yf-interest-share-friend,.yf-sheet.sheet-interest .yf-interest-download{


  margin-left:auto!important;
  margin-right:auto!important;


  border-radius:10px!important;
  font-size:13px!important;
  font-weight:800!important;
  
  
  }
.yf-sheet.sheet-contact .yf-contact-wa{margin-top:0!important;}
.yf-sheet.sheet-contact .yf-msg-btn{margin-top:0!important;}
.yf-sheet.sheet-interest .yf-interest-send-merchant,.yf-sheet.sheet-interest .yf-interest-share-friend,.yf-sheet.sheet-interest .yf-interest-download{margin-top:0!important;
  margin-bottom:0!important;}


html.yf-lang-ar .yf-sheet.sheet-contact,html.yf-lang-ar .yf-sheet.sheet-interest,html.yf-lang-ar .yf-sheet.yf-cat-top-panel{direction:rtl!important;}
@media (max-width:767px){.yf-sheet.yf-msg-form-open,.yf-sheet.show.yf-msg-form-open,.yf-sheet.sheet-contact.yf-msg-form-open{position:fixed!important;
    left:50%!important;
    right:auto!important;
    top:50%!important;
    bottom:auto!important;
    width:calc(100vw - 24px)!important;
    max-width:360px!important;
    max-height:calc(100dvh - 56px)!important;
    transform:translate(-50%,-50%)!important;
    border-radius:12px!important;
    overflow:hidden!important;
    box-shadow:0 10px 32px rgba(0,0,0,.22)!important;
    display:flex!important;
    flex-direction:column!important;
    opacity:1!important;}
.yf-sheet.yf-msg-form-open .yf-msg-form-body{max-height:calc(100dvh - 108px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;}}


@media (max-width:767px){.yf-wa{right:4px!important;
    top:calc(60vh - 21px)!important;
    bottom:auto!important;
    opacity:0!important;
    transform:none!important;
    transition:opacity .18s ease, top .16s ease!important;}
.yf-wa.yf-wa-show{opacity:1!important;
    pointer-events:auto!important;
    transform:none!important;}
.yf-wa.yf-wa-dragging{transition:none!important;}
.yf-top{opacity:0!important;
    pointer-events:none!important;}
.yf-top.yf-top-active{opacity:1!important;
    pointer-events:auto!important;}}

.yf-sheet.sheet-contact .yf-sheet-body.yf-contact-body,.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body{padding:12px!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-scroll,.yf-sheet.sheet-interest .yf-interest-scroll{width:100%!important;
  max-width:260px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-row,.yf-sheet.sheet-interest .yf-interest-item{


  background:#fafafa!important;
  border:1px solid #f1f1f1!important;
  border-radius:10px!important;
  box-shadow:none!important;}
.yf-sheet.sheet-interest .yf-interest-item{
  margin-bottom:8px!important;


  }
.yf-sheet.sheet-contact .yf-contact-actions{width:80%!important;
  max-width:208px!important;
  margin:8px auto 0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:6px!important;
  box-sizing:border-box!important;
  background:transparent!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;}
.yf-sheet.sheet-contact .yf-contact-wa,.yf-sheet.sheet-contact .yf-msg-btn,.yf-sheet.sheet-interest .yf-interest-send-merchant,.yf-sheet.sheet-interest .yf-interest-share-friend,.yf-sheet.sheet-interest .yf-interest-download{width:100%!important;
  max-width:208px!important;
  height:36px!important;
  min-height:36px!important;
  margin:0 auto!important;
  padding:0 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  box-sizing:border-box!important;
  position:relative!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  transform:none!important;
  float:none!important;
  clear:both!important;
  line-height:1.18!important;
  white-space:normal!important;}
.yf-sheet.sheet-contact .yf-contact-tip{width:100%!important;
  text-align:center!important;
  margin:0 auto!important;
  padding-top:2px!important;}
@media (max-width:767px){.yf-sheet.sheet-contact .yf-contact-scroll,.yf-sheet.sheet-interest .yf-interest-scroll{max-width:260px!important;}
.yf-sheet.sheet-contact .yf-contact-actions{max-width:208px!important;
    gap:6px!important;}}
@media (max-width:767px){
  .yf-detail-hero .yf-detail-arrow,.yf-detail-hero.video-playing .yf-detail-arrow{display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;}
}
@media (min-width:768px){
  .yf-detail-page .yf-detail-hero .yf-detail-arrow{display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:50%!important;
    border:1px solid rgba(0,0,0,.10)!important;
    background:rgba(255,255,255,.46)!important;
    -webkit-backdrop-filter:blur(8px) saturate(135%)!important;
    backdrop-filter:blur(8px) saturate(135%)!important;
    box-shadow:0 2px 8px rgba(0,0,0,.10)!important;
    color:transparent!important;
    font-size:0!important;
    line-height:0!important;
    z-index:40!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity .18s ease, visibility .18s ease, background .18s ease!important;}
  .yf-detail-page .yf-detail-hero.yf-has-gallery-nav:not(.video-playing):hover .yf-detail-arrow{opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;}
  .yf-detail-page .yf-detail-hero.video-playing .yf-detail-arrow{display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;}
  .yf-detail-page .yf-detail-hero .yf-detail-arrow:active{background:rgba(255,255,255,.60)!important;}
  .yf-detail-page .yf-detail-prev{left:10px!important;}
  .yf-detail-page .yf-detail-next{right:10px!important;transform:translateY(-50%) scaleX(-1)!important;}
  .yf-detail-page .yf-detail-arrow::before,.yf-detail-page .yf-detail-arrow::after{content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:11px!important;
    height:2px!important;
    margin:0!important;
    border:0!important;
    border-radius:2px!important;
    background:rgba(35,35,35,.78)!important;
    transform-origin:left center!important;}
  .yf-detail-page .yf-detail-arrow::before{transform:translate(-4px,-1px) rotate(43deg)!important;}
  .yf-detail-page .yf-detail-arrow::after{transform:translate(-4px,-1px) rotate(-43deg)!important;}
}
.yf-detail-video-close{


  display:flex!important;
  align-items:center!important;
  justify-content:center!important;}
.yf-detail-thumb-video,.yf-detail-thumb-video::before{border-radius:0!important;}
.yf-sheet.sheet-interest .yf-sheet-body,.yf-sheet.sheet-interest .yf-interest-body{padding:10px!important;
  box-sizing:border-box!important;}


.yf-sheet.yf-cat-top-panel .yf-cat-col-l3{display:flex!important;
  opacity:1!important;
  visibility:visible!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-col-l1,.yf-sheet.yf-cat-top-panel .yf-cat-col-l2,.yf-sheet.yf-cat-top-panel .yf-cat-col-l3{flex:0 0 auto!important;}
.yf-detail-video-layer.show{z-index:20!important;}
.yf-detail-video-layer.show #yfDetailVideoFrame,.yf-detail-video-layer.show iframe,.yf-detail-video-layer.show video{z-index:1!important;}
.yf-detail-video-bar{z-index:30!important;
  pointer-events:none!important;
  justify-content:space-between!important;
  padding:0 10px!important;
  box-sizing:border-box!important;}
.yf-detail-video-switch,.yf-detail-video-close{pointer-events:auto!important;}
.yf-detail-video-switch{position:absolute!important;
  top:10px!important;
  left:10px!important;
  right:auto!important;
  z-index:31!important;
  max-width:42%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;}
.yf-detail-video-close{position:absolute!important;
  top:10px!important;
  right:10px!important;
  left:auto!important;
  z-index:32!important;}
.yf-detail-video-error-close{top:10px!important;
  right:10px!important;
  left:auto!important;
  transform:none!important;
  z-index:33!important;}
#yfLightboxStage,#yfDetailHero{touch-action:pan-y!important;}
#yfLightbox.show #yfLightboxStage{touch-action:none!important;}
@media (max-width:767px){.yf-detail-video-switch{top:12px!important;
    left:12px!important;
    max-width:50%!important;}
.yf-detail-video-close,.yf-detail-video-error-close{top:12px!important;
    right:12px!important;}}
@media (max-width:767px){#yfWA.yf-wa,.yf-wa#yfWA,.yf-wa{right:0!important;
    left:auto!important;
    
    bottom:auto!important;
    width:42px!important;
    height:42px!important;
    transform:none!important;
    transition:opacity .18s ease, top .16s ease!important;
    z-index:100002!important;
    touch-action:none!important;}
#yfWA.yf-wa.yf-wa-show,.yf-wa#yfWA.yf-wa-show,.yf-wa.yf-wa-show{right:0!important;
    left:auto!important;
    bottom:auto!important;
    transform:none!important;
    opacity:1!important;
    pointer-events:auto!important;}
#yfWA.yf-wa.yf-wa-dragging,.yf-wa#yfWA.yf-wa-dragging,.yf-wa.yf-wa-dragging{transition:none!important;}}
#yfWA.yf-wa,.yf-wa#yfWA,.yf-wa{
  
  bottom:auto!important;
  top:calc(56vh - 21px)!important;
  z-index:100002!important;


  }
#yfWA.yf-wa.yf-wa-show,.yf-wa#yfWA.yf-wa-show,.yf-wa.yf-wa-show{opacity:1!important;
  pointer-events:auto!important;
  right:0!important;
  left:auto!important;
  bottom:auto!important;}

@media (max-width:767px){#yfWA.yf-wa,.yf-wa#yfWA,.yf-wa{top:calc(70dvh - 21px)!important;}}

.yf-detail-video-layer.show .yf-detail-video-switch{top:56px!important;
  left:10px!important;}
.yf-detail-video-layer.show .yf-detail-video-close,.yf-detail-video-layer.show .yf-detail-video-error-close{top:56px!important;
  right:10px!important;}
@media (max-width:767px){
.yf-detail-video-layer.show .yf-detail-video-switch{top:58px!important;
    left:12px!important;}
.yf-detail-video-layer.show .yf-detail-video-close,.yf-detail-video-layer.show .yf-detail-video-error-close{top:58px!important;
    right:12px!important;}}
.yf-success-tip-mask{position:fixed!important;
  inset:0!important;
  z-index:300000!important;
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  background:rgba(0,0,0,.18)!important;
  pointer-events:none!important;}
.yf-success-tip-mask.show{display:flex!important;}
.yf-success-tip-box{width:min(340px,calc(100vw - 56px))!important;
  min-height:150px!important;
  padding:26px 26px 24px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.22)!important;
  border:1px solid rgba(255,255,255,.9)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  box-sizing:border-box!important;}
.yf-success-tip-icon{width:64px!important;
  height:64px!important;
  border:4px solid #32d74b!important;
  color:#32d74b!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:42px!important;
  line-height:1!important;
  font-weight:500!important;
  margin:0 0 16px!important;
  box-sizing:border-box!important;}
.yf-success-tip-title{font-size:18px!important;
  line-height:1.25!important;
  color:#111!important;
  font-weight:800!important;
  margin:0 0 10px!important;}
.yf-success-tip-text{font-size:14px!important;
  line-height:1.5!important;
  color:#555!important;
  font-weight:500!important;
  max-width:280px!important;}
.yf-success-tip-title,.yf-success-tip-text{direction:inherit!important;
  unicode-bidi:plaintext!important;}

.yf-sheet.sheet-contact .yf-sheet-body.yf-contact-body{padding:10px!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-scroll,.yf-sheet.sheet-contact .yf-contact-actions{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-row{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body,.yf-sheet.sheet-interest .yf-interest-body{padding:10px!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-scroll{width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-item{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-item{
  height:auto!important;
  margin:0 0 8px!important;
  padding:2px 10px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  background:#f5f5f5!important;
  border:1px solid #f1f1f1!important;
  border-radius:10px!important;
  box-shadow:none!important;}
.yf-sheet.sheet-interest .yf-interest-img{width:44px!important;
  height:44px!important;
  object-fit:cover!important;
  flex:0 0 44px!important;}
.yf-sheet.sheet-interest .yf-interest-del{flex:0 0 auto!important;}
#yfWA.yf-wa,.yf-wa#yfWA,.yf-wa{
  
  cursor:grab!important;


  -webkit-touch-callout:none!important;
  pointer-events:auto!important;}
#yfWA.yf-wa.yf-wa-dragging,.yf-wa#yfWA.yf-wa-dragging,.yf-wa.yf-wa-dragging{cursor:grabbing!important;
  transition:none!important;}

.yf-detail-thumbs img:hover,.yf-detail-thumbs img.sel,.yf-detail-thumb-video:hover,.yf-detail-thumb-video.sel{


  outline-offset:0!important;
  }
.yf-detail-thumb-video::after{transform:none!important;}
@media (max-width:767px){.yf-detail-page > .yf-bottom,.yf-detail-page > .yf-top{display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;}
}

.yf-detail-price-item span{font-size:0.6875rem!important; 
  line-height:1.25!important;}
@media (max-width:767px){.yf-detail-basic > div{display:flex!important;
    flex-direction:column!important;
    gap:2px!important;
    line-height:1.2!important;}
.yf-detail-basic > div:first-child{align-items:flex-start!important;
    text-align:left!important;}
.yf-detail-basic > div:nth-child(2),.yf-detail-basic > div:last-child{align-items:center!important;
    text-align:center!important;}
.yf-detail-basic > div > span,.yf-detail-basic > div > b,.yf-detail-basic .yf-basic-val{display:block!important;
    margin:0!important;
    line-height:1.2!important;}}
#yfWA.yf-wa,.yf-wa#yfWA,.yf-wa{right:0!important;
  left:auto!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;}
@media (max-width:767px){

.yf-detail-page > .yf-detail-hero,.yf-detail-page .yf-detail-hero{margin-top:0!important;}}


.yf-detail-thumbs img,.yf-detail-thumb-video{width:60px!important;
  height:60px!important;
  min-width:60px!important;
  max-width:60px!important;
  flex:0 0 60px!important;
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  box-sizing:border-box!important;
  border:1px solid transparent!important;
  outline:0!important;
  border-radius:0!important;
  padding:0!important;
  margin:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  touch-action:manipulation!important;
  -webkit-user-select:none!important;
  user-select:none!important;
  -webkit-touch-callout:none!important;}
.yf-detail-thumbs img:hover,.yf-detail-thumbs img.sel,.yf-detail-thumb-video:hover,.yf-detail-thumb-video.sel{width:60px!important;
  height:60px!important;
  min-width:60px!important;
  max-width:60px!important;
  flex-basis:60px!important;
  border:1px solid #ff6a00!important;
  outline:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}
.yf-sheet.sheet-contact,.yf-sheet.sheet-interest{width:min(280px,calc(100vw - 104px))!important;
  max-width:min(280px,calc(100vw - 104px))!important;}
.yf-sheet.sheet-contact .yf-sheet-body.yf-contact-body,.yf-sheet.sheet-interest .yf-sheet-body.yf-interest-body,.yf-sheet.sheet-interest .yf-interest-body{padding:14px!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-scroll,.yf-sheet.sheet-contact .yf-contact-actions,.yf-sheet.sheet-interest .yf-interest-scroll{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-row,.yf-sheet.sheet-interest .yf-interest-item{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-contact .yf-contact-actions a,.yf-sheet.sheet-contact .yf-contact-actions button{width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;}
.yf-sheet.sheet-interest .yf-interest-item{min-height:50px!important;
  padding-top:2px!important;
  padding-bottom:2px!important;}


.yf-detail-price{
  
  width:auto!important;
  box-sizing:border-box!important;
  justify-content:center!important;
  align-items:stretch!important;
  padding-left:0!important;
  padding-right:0!important;
  text-align:center!important;}
.yf-detail-price-item{display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  box-sizing:border-box!important;}
.yf-detail-price-item strong{
  
  
  font-weight:800!important;}

.yf-detail-page .yf-detail-thumbs,.yf-detail-page #yfDetailThumbs{align-items:center!important;
  }
.yf-detail-page .yf-detail-thumbs > img,.yf-detail-page #yfDetailThumbs > img,.yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video,.yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video{width:60px!important;
  height:60px!important;
  min-width:60px!important;
  max-width:60px!important;
  min-height:60px!important;
  max-height:60px!important;
  
  aspect-ratio:1/1!important;
  object-fit:cover!important;
  box-sizing:border-box!important;
  border:1px solid transparent!important;
  outline:0!important;
  outline-offset:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding:0!important;
  
  transform:none!important;
  transition:none!important;
  animation:none!important;
  background-size:cover!important;
  background-position:center!important;}
.yf-detail-page .yf-detail-thumbs > img:hover,.yf-detail-page #yfDetailThumbs > img:hover,.yf-detail-page .yf-detail-thumbs > img.sel,.yf-detail-page #yfDetailThumbs > img.sel,.yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video:hover,.yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video:hover,.yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video.sel,.yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video.sel{width:60px!important;
  height:60px!important;
  min-width:60px!important;
  max-width:60px!important;
  min-height:60px!important;
  max-height:60px!important;
  flex:0 0 60px!important;
  border:1px solid #ff6a00!important;
  outline:0!important;
  box-shadow:none!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}
.yf-detail-page .yf-detail-thumb-video::before{inset:0!important;
  border-radius:0!important;}
.yf-detail-page .yf-detail-thumb-video::after{transform:none!important;
  transition:none!important;
  animation:none!important;}

.yf-detail-price-item strong{font-size:0.875rem!important; 
  line-height:1.2!important;
  }
.yf-detail-price-item span,.yf-detail-price-item span b,.yf-detail-price-item span b em{font-size:0.8125rem!important;
  line-height:1.2!important;
  font-weight:600!important;
  color:#111!important;
  font-style:normal!important;}

.yf-detail-price{margin-left:12px!important;
  margin-right:12px!important;}
.yf-detail-price-item strong{margin-bottom:0!important;}
@media (min-width:768px){html body .yf-detail-page{margin-top:0!important}

html body .yf-detail-page ~ .yf-sheet.yf-cat-top-panel,html body .yf-sheet.yf-cat-top-panel{max-height:calc(100vh - 90px)!important;
    overflow:auto!important;}}
.yf-detail-page #yfDetailBuy,.yf-detail-page .yf-detail-buy,.yf-detail-page > .yf-detail-actions,.yf-detail-page .yf-detail-about + .yf-detail-actions,.yf-detail-page .yf-detail-images + .yf-detail-actions{display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;}
.yf-detail-page .yf-detail-images:empty{display:none!important;}
.yf-detail-page .yf-detail-images img:not([src]),.yf-detail-page .yf-detail-images img[src=""]{display:none!important;}

.yf-detail-page .yf-detail-gallery,.yf-detail-page .yf-detail-hero{margin-bottom:0!important;
  }
.yf-detail-page .yf-thumb-arrow-wrap,.yf-detail-page .yf-detail-thumbs-wrap{margin-top:2px!important;
  margin-bottom:0!important;
  padding-top:0!important;
  padding-bottom:0!important;}
.yf-detail-page .yf-detail-info{
  min-height:0!important;}
@media (max-width:767px){.yf-detail-page .yf-thumb-arrow-wrap,.yf-detail-page .yf-detail-thumbs-wrap{margin-top:2px!important;
    margin-bottom:0!important;}
.yf-detail-page .yf-detail-info{margin-top:2px!important;}}
body .yf-wa:not(#yfWA){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;}
.yf-detail-page .yf-detail-main-img[src=""],.yf-detail-page .yf-detail-main-img:not([src]){display:none!important;}

.yf-detail-about.yf-empty-section,.yf-detail-images.yf-empty-section,.yf-detail-about[hidden],.yf-detail-images[hidden],.yf-detail-about:empty,.yf-detail-images:empty{
  visibility:hidden!important;
  opacity:0!important;


  }
.yf-detail-info .yf-detail-actions{display:flex!important;
  visibility:visible!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:visible!important;
  pointer-events:auto!important;}
.yf-detail-info .yf-detail-interested{display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  pointer-events:auto!important;}
.yf-detail-buy,#yfDetailBuy{display:none!important;}
@media (max-width:767px){html body .yf-detail-page{
    margin-top:0!important;
    overflow:visible!important;}
html body .yf-detail-page > .yf-detail-content,html body .yf-detail-page .yf-detail-gallery,html body .yf-detail-page .yf-detail-hero{margin-top:0!important;
    padding-top:0!important;
    overflow:visible!important;}
html body .yf-detail-page .yf-detail-hero{position:relative!important;
    z-index:1!important;}
html body .yf-detail-page .yf-detail-main-img{display:block!important;
    width:100%!important;
    aspect-ratio:1/1!important;
    object-fit:cover!important;
    object-position:center center!important;}}
.yf-detail-about:not(.yf-empty-section):not([hidden]),.yf-detail-images:not(.yf-empty-section):not([hidden]){


  min-height:0!important;
  
  margin:0!important;
  padding:0!important;
  overflow:visible!important;}
.yf-detail-about:not(.yf-empty-section):not([hidden]){line-height:1.6!important;
  background:#fff!important;}
.yf-detail-images:not(.yf-empty-section):not([hidden]){line-height:0!important;
  background:#fff!important;}
.yf-detail-images:not(.yf-empty-section):not([hidden]) img{display:block!important;
  width:100%!important;
  height:auto!important;}
.yf-detail-about.yf-empty-section,.yf-detail-images.yf-empty-section,.yf-detail-about[hidden],.yf-detail-images[hidden],.yf-detail-about:empty,.yf-detail-images:empty{display:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;}
#yfSheet.yf-sheet:not(.show),.yf-sheet:not(.show),#yfDrawer.yf-drawer:not(.show),.yf-drawer:not(.show),#yfBackdrop.yf-backdrop:not(.show),.yf-backdrop:not(.show){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;}
#yfSheet.yf-sheet.show,.yf-sheet.show{display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:60vh!important;
  width:auto;
  max-width:calc(100vw - 16px);}
#yfDrawer.yf-drawer.show,.yf-drawer.show{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  width:auto;
  min-width:80px!important;
  max-width:calc(100vw - 12px);}
#yfBackdrop.yf-backdrop.show,.yf-backdrop.show{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;}
.yf-detail-about:not(.yf-empty-section):not([hidden]),.yf-detail-images:not(.yf-empty-section):not([hidden]){display:block!important;
  visibility:visible!important;
  opacity:1!important;
  height:auto!important;
  max-height:none!important;
  width:auto!important;
  max-width:none!important;}
.yf-detail-page .yf-detail-gallery,.yf-detail-page .yf-detail-hero{padding-bottom:0!important;}
.yf-detail-page .yf-detail-thumbs-wrap,.yf-detail-page .yf-thumb-arrow-wrap{margin-top:3px!important;
  margin-bottom:0!important;
  padding-top:0!important;
  padding-bottom:0!important;}
.yf-detail-page .yf-detail-thumbs,.yf-detail-page #yfDetailThumbs{gap:3px!important;
  margin-top:3px!important;
  margin-bottom:0!important;
  padding-top:0!important;
  padding-bottom:0!important;}
.yf-detail-page .yf-detail-thumbs > img,.yf-detail-page #yfDetailThumbs > img,.yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video,.yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video{margin:0!important;
  flex:0 0 auto!important;}
.yf-detail-page .yf-thumb-arrow.left{margin-right:3px!important;}
.yf-detail-page .yf-thumb-arrow.right{margin-left:3px!important;}
.yf-detail-page .yf-detail-gallery{margin-bottom:3px!important;}
.yf-detail-page .yf-detail-info{margin-top:0!important;}
@media (min-width:768px){.yf-detail-info.yf-info-stretch{display:flex!important;
    flex-direction:column!important;}
.yf-detail-info.yf-info-stretch .yf-detail-actions{margin-top:0!important;}
.yf-detail-info.yf-info-stretch .yf-detail-interested{margin-top:0!important;}}
html body .yf-detail-page .yf-detail-gallery,html body .yf-detail-page .yf-detail-hero{margin-bottom:0!important;
  padding-bottom:0!important;}

html body .yf-detail-page #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs{display:flex!important;


  }
html body .yf-detail-page .yf-thumb-arrow-wrap #yfDetailThumbs,html body .yf-detail-page .yf-thumb-arrow-wrap .yf-detail-thumbs,html body .yf-detail-page .yf-detail-thumbs-wrap #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs-wrap .yf-detail-thumbs{margin-top:3px!important;}
html body .yf-detail-page #yfDetailThumbs > *,html body .yf-detail-page .yf-detail-thumbs > *{margin:0!important;}
html body .yf-detail-page .yf-detail-hero > button@media (min-width:768px){
html body .yf-detail-page .yf-detail-info.yf-info-stretch .yf-detail-actions{margin-top:0!important;}}
html body #yfSheet.yf-sheet:not(.show),html body .yf-detail-page #yfSheet.yf-sheet:not(.show),html body #yfDrawer.yf-drawer:not(.show),html body .yf-detail-page #yfDrawer.yf-drawer:not(.show),html body #yfBackdrop.yf-backdrop:not(.show),html body .yf-detail-page #yfBackdrop.yf-backdrop:not(.show),html body .yf-success-tip-mask:not(.show){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;}
html body #yfSheet.yf-sheet.show,html body .yf-detail-page #yfSheet.yf-sheet.show{display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  height:auto!important;
  width:auto;
  min-width:0;
  max-width:calc(100vw - 16px);}
html body #yfDrawer.yf-drawer.show,html body .yf-detail-page #yfDrawer.yf-drawer.show{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  height:auto!important;
  width:auto;
  min-width:80px!important;
  max-width:calc(100vw - 12px);}
html body #yfBackdrop.yf-backdrop.show,html body .yf-detail-page #yfBackdrop.yf-backdrop.show{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;}

@media (min-width:768px){html body .yf-detail-page .yf-detail-info.yf-info-stretch{display:flex!important;
    flex-direction:column!important;
    background:#fff!important;}
html body .yf-detail-page .yf-detail-info.yf-info-stretch .yf-detail-actions,html body .yf-detail-page .yf-detail-info.yf-info-stretch .yf-detail-interested{margin-top:0!important;
    flex:0 0 auto!important;}
html body .yf-detail-page .yf-detail-info-fill{display:block!important;
    flex:1 1 auto!important;
    background:#fff!important;}}
html body #yfSheet.yf-sheet:not(.show),html body #yfDrawer.yf-drawer:not(.show),html body #yfBackdrop.yf-backdrop:not(.show){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;}
@media (max-width:767px){


html body .yf-detail-page #yfDetailThumbs > *,html body .yf-detail-page .yf-detail-thumbs > *{margin:0!important;
    padding:0!important;}

}
@media (max-width:767px){html body .yf-detail-page .yf-detail-info{
    position:relative!important;
    
    
    transition:none!important;
    animation:none!important;
    will-change:auto!important;}}
html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]){padding:6px!important;


  }
@media (max-width:767px){html body .yf-detail-page .yf-detail-gallery{margin-bottom:0!important;
    padding-bottom:0!important;}
html body .yf-detail-page .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-thumbs-wrap{height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding-top:0!important;
    padding-bottom:0!important;
    position:relative!important;
    top:0!important;
    transform:none!important;
    display:flex!important;
    align-items:center!important;
    overflow:hidden!important;}
html body .yf-detail-page .yf-thumb-arrow{height:66px!important;
    min-height:66px!important;
    max-height:66px!important;
    align-self:center!important;}
html body .yf-detail-page #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs{gap:3px!important;
    column-gap:3px!important;
    row-gap:3px!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding-top:0!important;
    padding-bottom:0!important;
    align-items:center!important;}
html body .yf-detail-page .yf-detail-info{margin-top:0!important;
    top:0!important;
    transform:none!important;}}
html body .yf-detail-page .yf-thumb-arrow-wrap{display:flex!important;
  align-items:center!important;
  width:100%!important;}


html body .yf-detail-page .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-thumbs-wrap{margin-top:0!important;
  
  padding-top:0!important;


  display:flex!important;
  align-items:center!important;
  
  }
html body .yf-detail-page .yf-thumb-arrow{


  margin-top:0!important;
  margin-bottom:0!important;
  transition:none!important;
  box-sizing:border-box!important;}
html body .yf-detail-page #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs{
  
  
  margin-top:0!important;
  
  padding-top:0!important;
  
  align-items:center!important;
  }
html body .yf-detail-page .yf-thumb-arrow.left{margin-right:3px!important;}
html body .yf-detail-page .yf-thumb-arrow.right{margin-left:3px!important;}
html body .yf-detail-page .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-thumbs-wrap{
  
  box-sizing:content-box!important;
  overflow:hidden!important;}
html body .yf-detail-page .yf-thumb-arrow{height:66px!important;
  min-height:66px!important;
  max-height:66px!important;
  align-self:flex-start!important;}
html body .yf-detail-page #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs{margin-bottom:0!important;
  padding-bottom:0!important;}
html body .yf-detail-page .yf-detail-gallery{margin-bottom:0!important;
  padding-bottom:0!important;}
.yf-search{position:relative!important;}
.yf-search > svg:first-child{display:none!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
  flex:0 0 0!important;
  opacity:0!important;
  pointer-events:none!important;}
.yf-search input{margin-left:0!important;
  padding-left:0!important;}
.yf-search:not(:focus-within):not(.yf-search-has-value) input{padding-left:30px!important;}
.yf-search::before{content:"";
  position:absolute;
  left:11px;
  top:50%;
  width:15px;
  height:15px;
  border:1.6px solid #b8b8b8;
  border-radius:50%;
  transform:translateY(-56%);
  box-sizing:border-box;
  pointer-events:none;
  z-index:2;}
.yf-search::after{content:"";
  position:absolute;
  left:24px;
  top:21px;
  width:8px;
  height:1.6px;
  background:#b8b8b8;
  border-radius:999px;
  transform:rotate(45deg);
  transform-origin:left center;
  pointer-events:none;
  z-index:2;}
.yf-search:focus-within::before,.yf-search:focus-within::after,.yf-search.yf-search-has-value::before,.yf-search.yf-search-has-value::after{display:none!important;}
html body .yf-detail-page .yf-detail-content,html body .yf-detail-page .yf-detail-gallery{margin-bottom:0!important;
  padding-bottom:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-thumbs-wrap{margin-bottom:0!important;
  padding-bottom:0!important;
  top:auto!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-detail-info{
  
  
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]){


  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]) h2{margin:0 0 6px!important;
  padding:0!important;
  line-height:1.35!important;}
html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]) p,html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]) div{margin:0!important;
  padding:0!important;
  line-height:1.65!important;}
html body .yf-detail-page .yf-detail-images{


  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-detail-content,html body .yf-detail-page .yf-detail-gallery,html body .yf-detail-page .yf-detail-info,html body .yf-detail-page .yf-detail-about,html body .yf-detail-page .yf-detail-images{transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page .yf-detail-gallery,html body .yf-detail-page .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-thumbs-wrap{margin-bottom:0!important;
  padding-bottom:0!important;}
html body .yf-detail-page .yf-detail-info{margin-top:0!important;
  position:static!important;
  top:auto!important;}
html body .yf-detail-page .yf-detail-about:not(.yf-empty-section):not([hidden]){margin-top:0!important;
  padding-top:16px!important;
  padding-left:16px!important;
  padding-right:18px!important;
  padding-bottom:6px!important;
  box-sizing:border-box!important;
  background:#f7f6f4!important;
  line-height:1.65!important;}
html body .yf-detail-page .yf-detail-images{margin-top:0!important;
  padding-top:0!important;
  position:static!important;
  top:auto!important;}
html body .yf-detail-page #yfDetailInfo.yf-detail-info{


  margin-top:0!important;


  }

html body .yf-detail-page #yfDetailInfo .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-actions{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions:first-of-type{display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:auto!important;}
html body .yf-detail-page .yf-detail-interested{display:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions:first-of-type > .yf-detail-interested:first-of-type{display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  pointer-events:auto!important;}
html body .yf-detail-page .yf-detail-buy,html body .yf-detail-page #yfDetailBuy{display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-about.yf-empty-section,html body .yf-detail-page .yf-detail-images.yf-empty-section,html body .yf-detail-page .yf-detail-about[hidden],html body .yf-detail-page .yf-detail-images[hidden]{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;}
html body .yf-detail-page #yfDetailInfo.yf-detail-info{min-height:0!important;
  height:auto!important;
  display:block!important;
  flex:none!important;
  flex-direction:initial!important;
  position:static!important;
  top:auto!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page #yfDetailInfo.yf-info-stretch{display:block!important;
  flex-direction:initial!important;
  min-height:0!important;
  height:auto!important;}
html body .yf-detail-page #yfDetailInfo .yf-detail-info-fill,html body .yf-detail-page .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-about:empty,html body .yf-detail-page .yf-detail-images:empty,html body .yf-detail-page .yf-detail-about.yf-empty-section,html body .yf-detail-page .yf-detail-images.yf-empty-section,html body .yf-detail-page .yf-detail-about[hidden],html body .yf-detail-page .yf-detail-images[hidden]{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;}
html body .yf-detail-page #yfDetailThumbs img,html body .yf-detail-page .yf-detail-thumbs img{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  box-sizing:border-box!important;
  margin-top:0!important;
  margin-bottom:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}
html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  box-sizing:border-box!important;
  margin-top:0!important;
  margin-bottom:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}

html body .yf-detail-page #yfDetailThumbs img,html body .yf-detail-page .yf-detail-thumbs img,html body .yf-detail-page #yfDetailThumbs img.sel,html body .yf-detail-page .yf-detail-thumbs img.sel,html body .yf-detail-page #yfDetailThumbs img:hover,html body .yf-detail-page .yf-detail-thumbs img:hover,html body .yf-detail-page #yfDetailThumbs img:active,html body .yf-detail-page .yf-detail-thumbs img:active{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video.sel,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video.sel,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video:hover,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video:hover,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video:active,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video:active{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page #yfDetailThumbs,html body .yf-detail-page .yf-detail-thumbs{gap:2px!important;
  column-gap:2px!important;
  row-gap:2px!important;
  transition:none!important;
  animation:none!important;
  transform:none!important;
  scroll-behavior:auto!important;}

html body .yf-detail-page #yfDetailThumbs img.sel,html body .yf-detail-page .yf-detail-thumbs img.sel,html body .yf-detail-page #yfDetailThumbs img:hover,html body .yf-detail-page .yf-detail-thumbs img:hover,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video.sel,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video.sel,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video:hover,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video:hover{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;


  box-shadow:none!important;


  will-change:auto!important;}
html body .yf-detail-page #yfDetailThumbs img:active,html body .yf-detail-page .yf-detail-thumbs img:active,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video:active,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video:active{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  transition:none!important;}
html body .yf-detail-page #yfDetailThumbs img,html body .yf-detail-page .yf-detail-thumbs img,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video{width:67px!important;
  height:67px!important;
  min-width:67px!important;
  min-height:67px!important;
  max-width:67px!important;
  max-height:67px!important;
  flex:0 0 67px!important;
  gap:2px!important;
  border:0!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;
  will-change:auto!important;}
html body .yf-detail-page #yfDetailThumbs img,html body .yf-detail-page .yf-detail-thumbs img,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video{outline:0!important;
  outline-offset:0!important;}
html body .yf-detail-page #yfDetailThumbs img.sel,html body .yf-detail-page .yf-detail-thumbs img.sel,html body .yf-detail-page #yfDetailThumbs img:hover,html body .yf-detail-page .yf-detail-thumbs img:hover,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video.sel,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video.sel,html body .yf-detail-page #yfDetailThumbs .yf-detail-thumb-video:hover,html body .yf-detail-page .yf-detail-thumbs .yf-detail-thumb-video:hover{outline:2px solid #ff6a00!important;
  outline-offset:-2px!important;
  border:0!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}
@media (min-width:768px){
html body .yf-detail-page #yfDetailInfo.yf-info-stretch .yf-detail-actions{flex:0 0 auto!important;
    margin-top:0!important;}
html body .yf-detail-page #yfDetailInfo.yf-info-stretch .yf-detail-info-fill{display:block!important;
    visibility:visible!important;
    opacity:1!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
    pointer-events:none!important;}}
@media (max-width:767px){html body .yf-detail-page #yfDetailInfo .yf-detail-info-fill{display:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;}}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{


  background:transparent!important;
  
  
  order:40!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested{


  transform:none!important;
  transition:none!important;
  animation:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-buy,html body .yf-detail-page #yfDetailInfo .yf-detail-buy,html body .yf-detail-page #yfDetailBuy{display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;}
@media (min-width:768px){html body .yf-detail-page #yfDetailInfo.yf-info-stretch{display:flex!important;
    flex-direction:column!important;
    background:#fff!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-info-fill{display:block!important;
    visibility:visible!important;
    opacity:1!important;
    flex:1 1 auto!important;
    
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
    pointer-events:none!important;}}
@media (max-width:767px){html body .yf-detail-page #yfDetailInfo{display:block!important;
    min-height:0!important;
    height:auto!important;}
}
html body .yf-detail-page #yfDetailPrice,html body .yf-detail-page #yfDetailPrice.yf-detail-price,html body .yf-detail-page .yf-detail-price{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page #yfDetailPrice > .yf-detail-price-item,html body .yf-detail-page .yf-detail-price > .yf-detail-price-item{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page > .yf-detail-actions,html body .yf-detail-page > .yf-detail-interested,html body .yf-detail-page > .yf-detail-info-fill,html body .yf-detail-page > .yf-detail-buy,html body .yf-detail-page > #yfDetailBuy,html body .yf-detail-page .yf-detail-content ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-content ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-content ~ .yf-detail-info-fill,html body .yf-detail-page .yf-detail-about ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-about ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-about ~ .yf-detail-info-fill,html body .yf-detail-page .yf-detail-images ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-images ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-images ~ .yf-detail-info-fill,html body .yf-detail-page .yf-detail-images ~ .yf-detail-buy,html body .yf-detail-page .yf-detail-about ~ .yf-detail-buy,html body .yf-detail-page .yf-detail-info:not(#yfDetailInfo),html body .yf-detail-page .yf-detail-images ~ .yf-detail-info:not(#yfDetailInfo),html body .yf-detail-page .yf-detail-about ~ .yf-detail-info:not(#yfDetailInfo){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{
  
  
  width:100%!important;
  
  min-height:0!important;
  max-height:none!important;


  }

@media (min-width:768px){html body .yf-detail-page #yfDetailInfo.yf-info-stretch > .yf-detail-info-fill{


    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;


    box-shadow:none!important;
    
    }}
@media (max-width:767px){html body .yf-detail-page #yfDetailInfo > .yf-detail-info-fill{
    visibility:hidden!important;
    opacity:0!important;


    pointer-events:none!important;}}
html body .yf-detail-page .yf-detail-about ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-about ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-about ~ .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page > .yf-detail-actions,html body .yf-detail-page > .yf-detail-interested,html body .yf-detail-page > .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-about .yf-detail-info,html body .yf-detail-page .yf-detail-about .yf-detail-actions,html body .yf-detail-page .yf-detail-about .yf-detail-interested,html body .yf-detail-page .yf-detail-about .yf-detail-info-fill,html body .yf-detail-page .yf-detail-images .yf-detail-info,html body .yf-detail-page .yf-detail-images .yf-detail-actions,html body .yf-detail-page .yf-detail-images .yf-detail-interested,html body .yf-detail-page .yf-detail-images .yf-detail-info-fill,html body .yf-detail-page .yf-detail-about ~ .yf-detail-info,html body .yf-detail-page .yf-detail-about ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-about ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-about ~ .yf-detail-info-fill,html body .yf-detail-page .yf-detail-about ~ * .yf-detail-info,html body .yf-detail-page .yf-detail-about ~ * .yf-detail-actions,html body .yf-detail-page .yf-detail-about ~ * .yf-detail-interested,html body .yf-detail-page .yf-detail-about ~ * .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-images > :not(img){display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page .yf-detail-desc-title{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:8px 6px 6px!important;
  padding:0!important;
  font-size:1rem!important;
  line-height:1.25!important;
  font-weight:700!important;
  color:#3a4a5c!important;
  background:transparent!important;
  transform:none!important;
  transition:none!important;
  animation:none!important;}
html body .yf-detail-page .yf-detail-desc-title[hidden],html body .yf-detail-page .yf-detail-desc-title.yf-empty-section{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  margin:0!important;
  padding:0!important;}
html body .yf-detail-page .yf-detail-about .yf-detail-actions,html body .yf-detail-page .yf-detail-about .yf-detail-interested,html body .yf-detail-page .yf-detail-about .yf-detail-info-fill,html body .yf-detail-page .yf-detail-about .yf-detail-info,html body .yf-detail-page .yf-detail-images .yf-detail-actions,html body .yf-detail-page .yf-detail-images .yf-detail-interested,html body .yf-detail-page .yf-detail-images .yf-detail-info-fill,html body .yf-detail-page .yf-detail-images .yf-detail-info,html body .yf-detail-page .yf-detail-content ~ .yf-detail-info,html body .yf-detail-page .yf-detail-content ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-content ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-content ~ .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:visible!important;
  pointer-events:auto!important;}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested{display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:#ff6a00!important;
  color:#fff!important;
  font-size:14px!important;
  font-weight:700!important;
  text-align:center!important;
  cursor:pointer!important;
  pointer-events:auto!important;}
@media (min-width:768px){html body .yf-detail-page #yfDetailInfo.yf-info-stretch > .yf-detail-info-fill{display:block!important;
    visibility:visible!important;
    opacity:1!important;
    flex:1 1 auto!important;
    background:#fff!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
    pointer-events:none!important;}}
@media (max-width:767px){html body .yf-detail-page #yfDetailInfo > .yf-detail-info-fill{display:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;}}
html body .yf-detail-page .yf-detail-about .yf-detail-price,html body .yf-detail-page .yf-detail-about .yf-detail-basic,html body .yf-detail-page .yf-detail-about .yf-detail-specs,html body .yf-detail-page .yf-detail-images .yf-detail-price,html body .yf-detail-page .yf-detail-images .yf-detail-basic,html body .yf-detail-page .yf-detail-images .yf-detail-specs,html body .yf-detail-page .yf-detail-content ~ .yf-detail-price,html body .yf-detail-page .yf-detail-content ~ .yf-detail-basic,html body .yf-detail-page .yf-detail-content ~ .yf-detail-specs,html body .yf-detail-page .yf-detail-content ~ .yf-detail-actions,html body .yf-detail-page .yf-detail-content ~ .yf-detail-interested,html body .yf-detail-page .yf-detail-content ~ .yf-detail-info-fill{display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  flex:0 0 0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
  pointer-events:none!important;}
html body .yf-detail-page #yfDetailInfo,html body .yf-detail-page .yf-detail-info{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page #yfDetailInfo > h1,html body .yf-detail-page .yf-detail-info > h1{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page #yfDetailPrice,html body .yf-detail-page .yf-detail-price,html body .yf-detail-page #yfDetailPrice > .yf-detail-price-item,html body .yf-detail-page .yf-detail-price > .yf-detail-price-item{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page .yf-detail-basic,html body .yf-detail-page .yf-detail-basic > div{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page #yfDetailSpecs,html body .yf-detail-page .yf-detail-specs,html body .yf-detail-page #yfDetailSpecs > div,html body .yf-detail-page .yf-detail-specs > div{background:#fff!important;
  background-color:#fff!important;}
html body .yf-detail-page #yfDetailInfo > h1,html body .yf-detail-page .yf-detail-price,html body .yf-detail-page .yf-detail-basic,html body .yf-detail-page .yf-detail-specs > div{border-color:#eee!important;}
.yf-detail-page .yf-num-unit,.yf-detail-page .yf-detail-price-item span b .yf-num-unit,.yf-detail-page .yf-basic-val b .yf-num-unit{direction:ltr!important;
  unicode-bidi:isolate!important;
  display:inline-flex!important;
  align-items:baseline!important;
  justify-content:flex-start!important;
  white-space:nowrap!important;
  flex-wrap:nowrap!important;
  gap:0!important;
  text-align:left!important;}
.yf-detail-page .yf-num-unit em{direction:ltr!important;
  unicode-bidi:isolate!important;
  display:inline!important;
  margin-left:0!important;
  margin-right:0!important;
  white-space:nowrap!important;}
html.yf-lang-ar .yf-detail-page .yf-detail-price-item span b,html.yf-lang-ar .yf-detail-page .yf-basic-val,html.yf-lang-ar .yf-detail-page .yf-basic-val b,body.yf-lang-ar .yf-detail-page .yf-detail-price-item span b,body.yf-lang-ar .yf-detail-page .yf-basic-val,body.yf-lang-ar .yf-detail-page .yf-basic-val b{direction:ltr!important;
  unicode-bidi:isolate!important;
  white-space:nowrap!important;}
html body .yf-detail-page .yf-detail-specs{border-top:1px solid #eee!important;}
.yf-sheet.yf-cat-top-panel,.yf-sheet.yf-cat-top-panel.show{transform:none!important;
  transition:none!important;
  animation:none!important;
  opacity:1!important;}
.yf-sheet.yf-cat-top-panel *,.yf-sheet.yf-cat-top-panel *::before,.yf-sheet.yf-cat-top-panel *::after{animation:none!important;}
.yf-sheet.yf-cat-top-panel button,.yf-sheet.yf-cat-top-panel button:hover,.yf-sheet.yf-cat-top-panel button:active,.yf-sheet.yf-cat-top-panel button:focus,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn.sel,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active,.yf-sheet.yf-cat-top-panel .yf-cat-all-btn:focus{transform:none!important;
  transition:none!important;
  animation:none!important;
  box-shadow:none!important;}
.yf-sheet.yf-cat-top-panel .yf-cat-all-btn{min-width:52px!important;
  text-align:left!important;}
html body .yf-sheet.yf-cat-top-panel .yf-cat-col{align-items:stretch!important;
  overflow-anchor:none!important;}
html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:focus,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:focus-visible,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn.sel{box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 9px!important;
  margin:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#111!important;
  box-shadow:none!important;
  text-shadow:none!important;
  font-size:13px!important;
  font-weight:600!important;
  line-height:30px!important;
  letter-spacing:normal!important;
  text-align:left!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  transform:none!important;
  translate:none!important;
  scale:none!important;
  rotate:none!important;
  transition:none!important;
  animation:none!important;
  filter:none!important;
  opacity:1!important;
  will-change:auto!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  overflow-anchor:none!important;}
html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn::before,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn::after,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover::before,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover::after,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active::before,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active::after{content:none!important;
  display:none!important;}
@media (max-width:767px){html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:hover,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:focus,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn:active,html body .yf-sheet.yf-cat-top-panel .yf-cat-all-btn.sel{height:29px!important;
    min-height:29px!important;
    padding:0 5px!important;
    line-height:29px!important;}}

/* QT-60: main product image is a fixed square display box; ignore portrait source height hints. */
html body .yf-detail-page .yf-detail-main-img{width:100%!important;height:auto!important;aspect-ratio:1/1!important;object-fit:cover!important;object-position:center center!important;}


/* QT-64: custom service is shown after the inquiry action bar, separate from hardware specifications. */
html body .yf-detail-page .yf-detail-custom-service{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-height:44px!important;
  margin:0!important;
  padding:10px 14px!important;
  border:0!important;
  border-bottom:1px solid #eceff3!important;
  background:#fff!important;
  color:#1f2937!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.45!important;
  letter-spacing:.01em!important;
  visibility:visible!important;
  opacity:1!important;
}
html body .yf-detail-page .yf-detail-custom-service[data-oem-odm="Yes"]::before,html body .yf-detail-page .yf-detail-custom-service[data-oem-odm="No"]::before{
  content:"";
  display:block;
  flex:0 0 7px;
  width:7px;
  height:7px;
  margin-right:9px;
  border-radius:50%;
  background:#ff6a00;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-custom-service,body.yf-lang-ar .yf-detail-page .yf-detail-custom-service{
  direction:rtl!important;
  text-align:right!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-custom-service::before,body.yf-lang-ar .yf-detail-page .yf-detail-custom-service::before{
  margin-right:0;
  margin-left:9px;
}
@media (max-width:767px){
  html body .yf-detail-page .yf-detail-custom-service{
    min-height:42px!important;
    padding:9px 11px!important;
    font-size:12px!important;
  }
}


/* QT-65: independent Product Inquiry switch, automatic single-button width, orange H2 headings, and matched press feedback. */
html body .yf-detail-page .yf-detail-spec-title,html body .yf-detail-page .yf-detail-desc-title{
  color:#ff6a00!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-product-message-hidden > .yf-detail-product-msg,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-interest-button-hidden > .yf-detail-interested{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-single-action > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-single-action > .yf-detail-product-msg{
  flex:1 1 100%!important;
  width:100%!important;
  max-width:100%!important;
  border-left:0!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg{
  transform:none!important;
  transform-origin:center center!important;
  
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}


/* QT-66: optically center the close glyph in the desktop detail lightbox button. */
@media (min-width:768px){
  html body #yfLightbox .yf-lightbox-close{
    padding:0!important;
    font-size:0!important;
    line-height:0!important;
    text-align:center!important;
  }
  html body #yfLightbox .yf-lightbox-close::before{
    content:"✕"!important;
    position:absolute!important;
    top:calc(50% - 1px)!important;
    left:50%!important;
    transform:translate(-50%,-50%)!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    color:#fff!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:20px!important;
    font-weight:400!important;
    line-height:1!important;
    pointer-events:none!important;
  }
}

/* QT-67: keep the action button body fixed; only press the label downward. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg{
  transition:none!important;
}

/* QT-68: desktop only — keep Custom Service directly below the action bar.
   Explicit flex order also protects the layout from legacy DOM/cache ordering. */
@media (min-width:768px){
  html body .yf-detail-page #yfDetailInfo > h1{
    order:10!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-price{
    order:20!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-basic{
    order:30!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-spec-title{
    order:40!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-specs{
    order:50!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{
    order:60!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service{
    order:70!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    order:75!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-info-fill{
    order:80!important;
  }
}


/* QT-69: responsive detail composition.
   Desktop: gallery and information card share one automatically equal-height row.
   Mobile: description H2 is visually part of the description content, not a separate color strip.
   Custom Service stays next to the conversion controls rather than mixing with hardware specifications. */
html body .yf-detail-page .yf-detail-description-section[hidden],html body .yf-detail-page .yf-detail-description-section.yf-empty-section{
  display:none!important;
}
html body .yf-detail-page .yf-detail-description-section{
  display:block!important;
  width:100%!important;
  margin:6px 0 0!important;


}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-desc-title{
  display:block!important;
  width:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:12px 14px 9px!important;
  color:#ff6a00!important;
  
  border:0!important;
  
  font-size:18px!important;
  font-weight:700!important;
  line-height:1.3!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){


  color:#111!important;
  line-height:1.65!important;
  
}

html body .yf-detail-page .yf-detail-description-section > .yf-detail-images:not(.yf-empty-section):not([hidden]){
  display:block!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  
  border:0!important;
  border-radius:0!important;
  line-height:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}

/* RELEASE-016: detail-description images keep an exact 2px gap.
   Only adjacent images receive the gap, so there is no extra space
   before the first image or after the final image. */
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images img + img{
  margin-top:2px!important;
}

/* Custom Service is a service-status row attached to the CTA area.
   Positive support uses the site orange; unavailable status uses neutral grey. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
  
  margin:0!important;
  
  background:#fff!important;
  border-top:0!important;
  border-bottom:1px solid #eceff3!important;
  color:#1f2937!important;
  
  font-weight:700!important;
  
}

html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service[data-oem-odm="Yes"]::before,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="Yes"]::before{
  background:#ff6a00!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service[data-oem-odm="No"]::before,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="No"]::before{
  background:#9ca3af!important;
}

@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    display:grid!important;
    grid-template-columns:52% 48%!important;
    
    align-items:stretch!important;
    
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    align-self:stretch!important;
    min-width:0!important;
    background:transparent!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    min-height:100%!important;
    margin:0!important;
    padding:0!important;
  }
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    margin:0!important;
  }
  html body .yf-detail-page .yf-detail-description-section{
    margin-top:2px!important;
  }
  html body .yf-detail-page .yf-detail-description-section > .yf-detail-desc-title{
    padding:12px 16px 9px!important;
    font-size:16px!important;
  }
  html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
    padding:12px 16px 14px!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    min-height:42px!important;
    padding:9px 13px!important;
    font-size:12.5px!important;
  }
}

@media (max-width:767px){
  html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    
    
    background:#fff!important;
    
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    border-bottom:0!important;
  }
  
  html body .yf-detail-page .yf-detail-description-section > .yf-detail-desc-title{
    padding:12px 14px 9px!important;
    background:#fff!important;
  }
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-desc-title{
  background:#fff!important;
  border-bottom:1px solid #e8e8e8!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
  
  
  background:#f7f7f7!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about .yf-detail-description-text,html body .yf-detail-page .yf-detail-description-section > .yf-detail-about .yf-detail-description-text > *{
  background:transparent!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images:not(.yf-empty-section):not([hidden]){
  background:#fff!important;
}

/* OEM & ODM and sample availability are intentionally compact and visually one service group. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
  min-height:36px!important;
  height:auto!important;
  padding:6px 13px!important;
  font-size:12.5px!important;
  line-height:1.35!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service{
  border-bottom:1px solid #eceff3!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
  border-bottom:0!important;
}

@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    gap:0!important;
    background:#fff!important;
  }
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    background:#fff!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-info-fill{
    background:transparent!important;
    border:0!important;
  }
  html body .yf-detail-page .yf-detail-hero{
    border:0!important;
    box-sizing:border-box!important;
    background:#fff!important;
  }
}

@media (max-width:767px){
  html body .yf-detail-page #yfDetailInfo > .yf-detail-custom-service,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    min-height:38px!important;
    padding:7px 12px!important;
    font-size:12.5px!important;
    line-height:1.35!important;
  }
  html body .yf-detail-page .yf-detail-description-section{
    margin-top:2px!important;
  }
}

/* QT-71: unify the Product Description heading with its text band,
   keep mobile specification labels on one line, and give Sample Service
   the same status-dot treatment as Custom Service. */
html body .yf-detail-page .yf-detail-description-section > .yf-detail-desc-title,html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
  background:#f7f7f7!important;
}

html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  visibility:visible!important;
  opacity:1!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="Yes"]::before,html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="No"]::before{
  content:""!important;
  display:block!important;
  flex:0 0 7px!important;
  width:7px!important;
  height:7px!important;
  margin-right:9px!important;
  border-radius:50%!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="Yes"]::before{
  background:#ff6a00!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service[data-sample-available="No"]::before{
  background:#9ca3af!important;
}
html.yf-lang-ar body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service,body.yf-lang-ar .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
  direction:rtl!important;
  text-align:right!important;
}
html.yf-lang-ar body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service::before,body.yf-lang-ar .yf-detail-page #yfDetailInfo > .yf-detail-sample-service::before{
  margin-right:0!important;
  margin-left:9px!important;
}

/* QT-73: three detail actions, persistent label press feedback, and factory-contact payment dialog. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact{
  box-sizing:border-box!important;
  overflow:hidden!important;
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > button > .yf-action-label{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  max-width:100%!important;
  min-width:0!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  
  
  pointer-events:none!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact{
  display:flex!important;
}
@media (max-width:767px){
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-three-actions > button{
    padding-left:2px!important;
    padding-right:2px!important;
    font-size:12px!important;
    letter-spacing:-.1px!important;
  }
  html.yf-lang-ar body .yf-detail-page #yfDetailInfo > .yf-detail-actions.yf-three-actions > button{
    font-size:11px!important;
  }
}
/* QT-75: account application and customer account dialogs */.yf-service-primary,.yf-service-secondary{display:flex;align-items:center;justify-content:center;width:100%;height:42px;margin-top:15px;border:0;border-radius:9px;background:#ff6a00;color:#fff;text-decoration:none;font-weight:800;font-size:14px;cursor:pointer}.yf-service-secondary{background:#fff;color:#ff6a00;border:1px solid #ff6a00}.yf-service-form-status{min-height:20px;margin-top:8px;color:#c2410c;font-size:12px}
/* QT-75: reviewed customer factory-service workflow */
html body #yfDrawer.yf-main-nav-drawer{width:154px!important;min-width:154px!important;max-height:min(330px,calc(100vh - 90px))!important;overflow-y:auto!important}


/* QT-75: hardened customer-service, resumable orders and password flow. */


.yf-return-supplier-preview{width:100%;min-height:40px;margin:0 0 10px;padding:0 13px;border:1px solid #ff6a00;border-radius:9px;background:#fff7ed;color:#c2410c;font-size:13px;font-weight:800;cursor:pointer}


/* QT-76: match the homepage navigation press feedback; keep the button fixed and make the label move only slightly. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg,html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact{
  transform:none!important;
  padding:0!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  transition:background-color .12s ease,box-shadow .12s ease,filter .12s ease!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > button > .yf-action-label{
  transform:translateY(0) scale(1)!important;
  transition:transform .10s ease,opacity .10s ease!important;
}

/* QT-76: keep the simplified two-column account form visually aligned. */


/* QT-78: enlarge all explanatory copy in Factory Contact; keep prices unchanged. */
.yf-factory-v2-mask .yf-supplier-preview-body h4{font-size:15.5px!important}
.yf-factory-v2-mask .yf-supplier-summary>p{font-size:13.5px!important;line-height:1.5!important}
.yf-factory-v2-mask .yf-supplier-summary>div{font-size:14px!important;line-height:1.6!important}
.yf-factory-v2-mask .yf-supplier-counters span{font-size:13px!important;line-height:1.4!important}
.yf-factory-v2-mask .yf-supplier-product span{font-size:13px!important;line-height:1.45!important;min-height:38px!important}
.yf-factory-v2-mask .yf-supplier-product small{font-size:12px!important;line-height:1.4!important}


/* QT-78: stable in-page factory/warehouse photo preview; never navigates away. */
@keyframes yfSupplierPhotoSpin{to{transform:rotate(360deg)}}


/* QT-79: account wording details and one visual standard for frontend dismiss/delete circles. */
.yf-required-star{
  display:inline!important;
  margin-left:2px!important;
  color:#ff6a00!important;
  font-style:normal!important;
  font-weight:900!important;
}

/* Standard close circle: based on the account-application dialog, with the glyph optically centered. */
.yf-service-ui-head button[data-yf-service-close],.yf-fc-head button[data-fc-close],.yf-sheet-close,.yf-interest-preview-close,.yf-product-msg-close,.yf-detail-video-close,.yf-detail-video-error-close,.yf-lightbox-close,.yf-supplier-photo-close{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f2f5f8!important;
  color:#111827!important;
  box-shadow:0 1px 3px rgba(15,23,42,.10)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  font-size:0!important;
  line-height:0!important;
  text-align:center!important;
  cursor:pointer!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
.yf-service-ui-head button[data-yf-service-close]::before,.yf-fc-head button[data-fc-close]::before,.yf-sheet-close::before,.yf-interest-preview-close::before,.yf-product-msg-close::before,.yf-detail-video-close::before,.yf-detail-video-error-close::before,.yf-lightbox-close::before,.yf-supplier-photo-close::before{
  content:"×"!important;
  position:static!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  color:inherit!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:24px!important;
  font-weight:400!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
  pointer-events:none!important;
}
.yf-service-ui-head button[data-yf-service-close]:active,.yf-fc-head button[data-fc-close]:active,.yf-sheet-close:active,.yf-interest-preview-close:active,.yf-product-msg-close:active,.yf-detail-video-close:active,.yf-detail-video-error-close:active,.yf-lightbox-close:active,.yf-supplier-photo-close:active{
  background:#e7ebf0!important;
  box-shadow:inset 0 1px 3px rgba(15,23,42,.14)!important;
}

/* My Interests item removal keeps a minus glyph, but uses the same circle, fill and alignment. */
.yf-sheet.sheet-interest .yf-interest-del{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f2f5f8!important;
  color:#111827!important;
  box-shadow:0 1px 3px rgba(15,23,42,.10)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  font-size:0!important;
  line-height:0!important;
}
.yf-sheet.sheet-interest .yf-interest-del::before{
  content:"−"!important;
  display:block!important;
  color:inherit!important;
  font-family:Arial,Helvetica,sans-serif!important;
  font-size:22px!important;
  font-weight:500!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
  pointer-events:none!important;
}
.yf-sheet.sheet-interest .yf-interest-del:active{
  background:#e7ebf0!important;
  box-shadow:inset 0 1px 3px rgba(15,23,42,.14)!important;
}


/* QT-85: one exact close/remove-circle standard for every frontend popup.
   The icon is drawn with CSS bars so its intersection is mathematically centered,
   and old button text can never create a second ×. */
.yf-service-ui-head button[data-yf-service-close],.yf-fc-head button[data-fc-close],.yf-sheet .yf-sheet-close,.yf-interest-preview-box .yf-interest-preview-close,.yf-product-msg-head .yf-product-msg-close,.yf-detail-video-close,.yf-detail-video-error-close,.yf-supplier-photo-stage .yf-supplier-photo-close{
  position:relative!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  flex:0 0 34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f2f5f8!important;
  color:transparent!important;
  box-shadow:0 1px 3px rgba(15,23,42,.10)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  text-indent:-9999px!important;
  font-size:0!important;
  line-height:0!important;
  box-sizing:border-box!important;
  cursor:pointer!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
.yf-service-ui-head button[data-yf-service-close]::before,.yf-service-ui-head button[data-yf-service-close]::after,.yf-fc-head button[data-fc-close]::before,.yf-fc-head button[data-fc-close]::after,.yf-sheet .yf-sheet-close::before,.yf-sheet .yf-sheet-close::after,.yf-interest-preview-box .yf-interest-preview-close::before,.yf-interest-preview-box .yf-interest-preview-close::after,.yf-product-msg-head .yf-product-msg-close::before,.yf-product-msg-head .yf-product-msg-close::after,.yf-detail-video-close::before,.yf-detail-video-close::after,.yf-detail-video-error-close::before,.yf-detail-video-error-close::after,.yf-supplier-photo-stage .yf-supplier-photo-close::before,.yf-supplier-photo-stage .yf-supplier-photo-close::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:16px!important;
  height:2px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#111827!important;
  transform-origin:center center!important;
  pointer-events:none!important;
}
.yf-service-ui-head button[data-yf-service-close]::before,.yf-fc-head button[data-fc-close]::before,.yf-sheet .yf-sheet-close::before,.yf-interest-preview-box .yf-interest-preview-close::before,.yf-product-msg-head .yf-product-msg-close::before,.yf-detail-video-close::before,.yf-detail-video-error-close::before,.yf-supplier-photo-stage .yf-supplier-photo-close::before{
  transform:translate(-50%,-50%) rotate(45deg)!important;
}
.yf-service-ui-head button[data-yf-service-close]::after,.yf-fc-head button[data-fc-close]::after,.yf-sheet .yf-sheet-close::after,.yf-interest-preview-box .yf-interest-preview-close::after,.yf-product-msg-head .yf-product-msg-close::after,.yf-detail-video-close::after,.yf-detail-video-error-close::after,.yf-supplier-photo-stage .yf-supplier-photo-close::after{
  transform:translate(-50%,-50%) rotate(-45deg)!important;
}
.yf-service-ui-head button[data-yf-service-close]:active,.yf-fc-head button[data-fc-close]:active,.yf-sheet .yf-sheet-close:active,.yf-interest-preview-box .yf-interest-preview-close:active,.yf-product-msg-head .yf-product-msg-close:active,.yf-detail-video-close:active,.yf-detail-video-error-close:active,.yf-supplier-photo-stage .yf-supplier-photo-close:active{
  background:#e7ebf0!important;
  box-shadow:inset 0 1px 3px rgba(15,23,42,.14)!important;
}

/* My Interests delete button: same circle, with one bar exactly through the center. */
.yf-sheet.sheet-interest button.yf-interest-del{
  position:relative!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  flex:0 0 34px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f2f5f8!important;
  color:transparent!important;
  box-shadow:0 1px 3px rgba(15,23,42,.10)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  text-indent:-9999px!important;
  font-size:0!important;
  line-height:0!important;
  box-sizing:border-box!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
.yf-sheet.sheet-interest button.yf-interest-del::before{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:16px!important;
  height:2px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:#111827!important;
  transform:translate(-50%,-50%)!important;
  pointer-events:none!important;
}
.yf-sheet.sheet-interest button.yf-interest-del::after{content:none!important;display:none!important;}
.yf-sheet.sheet-interest button.yf-interest-del:active{
  background:#e7ebf0!important;
  box-shadow:inset 0 1px 3px rgba(15,23,42,.14)!important;
}


/* QT-87: supplier product opens as a stable in-page read-only detail preview. */


/* QT-88: factory-contact and supplier-preview headers use the site orange.
   Back and close controls keep the same neutral circle; the back arrow is black. */


/* QT-92: detail lightbox controls — desktop and mobile use separate positioning,
   while sharing one softer dark control fill and one precisely centered close glyph. */
#yfLightbox .yf-lightbox-prev,#yfLightbox .yf-lightbox-next,#yfLightbox .yf-lightbox-close{
  background:rgba(45,45,45,.78)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.34)!important;
  box-shadow:0 2px 10px rgba(0,0,0,.28)!important;
  
}

/* Use one CSS-drawn X only; this prevents the mobile double-X and centers it optically. */
#yfLightbox .yf-lightbox-close{
  position:absolute!important;
  padding:0!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  overflow:hidden!important;
}
#yfLightbox .yf-lightbox-close::before,#yfLightbox .yf-lightbox-close::after{


  padding:0!important;


  pointer-events:none!important;
}

#yfLightbox .yf-lightbox-close::after{
  display:block!important;
  
}

/* Desktop: pull both right-side controls fully inside and align their centers vertically. */
@media (min-width:768px){
  #yfLightbox .yf-lightbox-next,#yfLightbox .yf-lightbox-close{
    right:20px!important;
    left:auto!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
  }
  #yfLightbox .yf-lightbox-close{
    top:20px!important;
  }
}

/* Mobile: soften all three circles, keep one centered X, and open chevrons to about 120 degrees. */
@media (max-width:767px){
  #yfLightbox .yf-lightbox-prev,#yfLightbox .yf-lightbox-next,#yfLightbox .yf-lightbox-close{
    background:rgba(45,45,45,.78)!important;
  }
  #yfLightbox .yf-lightbox-close{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
  }
  #yfLightbox .yf-lightbox-prev::before{
    transform:translate(-5px,-50%) rotate(60deg)!important;
  }
  #yfLightbox .yf-lightbox-prev::after{
    transform:translate(-5px,-50%) rotate(-60deg)!important;
  }
  #yfLightbox .yf-lightbox-next::before{
    transform:translate(5px,-50%) rotate(60deg)!important;
  }
  #yfLightbox .yf-lightbox-next::after{
    transform:translate(5px,-50%) rotate(-60deg)!important;
  }
}


/* QT-93: simplified paid services, supplier preview cost samples and readable customer account. */

/* QT-95: compact supplier-preview + WhatsApp action row; remove extra message action. */

/* QT-96: single-product cost label and compact supplier preview. */
.yf-service-category{color:#dc2626!important;font-weight:900!important}


/* SEO section H2 headings stay English. Their physical alignment is
   controlled by the final shared H2 rule below so Arabic can align right. */
.yf-detail-page .yf-detail-spec-title{
  box-sizing:border-box!important;
}

/* QT-100: final detail-page structure, H2 bars and lightbox controls. */
.yf-detail-page .yf-detail-info-fill{display:none!important;height:0!important;min-height:0!important;max-height:0!important;}
@media (min-width:768px){
  .yf-detail-page .yf-detail-content{
    align-items:start!important;
    background:#f4f5f6!important;
  }
  .yf-detail-page .yf-detail-gallery,.yf-detail-page .yf-detail-info{
    align-self:start!important;
    height:auto!important;
    min-height:0!important;
  }
  .yf-detail-page .yf-detail-gallery,.yf-detail-page .yf-thumb-arrow-wrap,.yf-detail-page #yfDetailThumbs,.yf-detail-page .yf-detail-thumbs{
    background:#f4f5f6!important;
  }
  .yf-detail-page #yfDetailThumbs,.yf-detail-page .yf-detail-thumbs{
    gap:4px!important;
    column-gap:4px!important;
    row-gap:4px!important;
    padding:0!important;
    margin-top:4px!important;
  }
}

/* Both semantic H2 bars share one flat visual hierarchy. */
.yf-detail-page .yf-detail-section-title.yf-detail-spec-title,.yf-detail-page .yf-detail-section-title.yf-detail-desc-title{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0 16px!important;
  box-sizing:border-box!important;
  background:#f0f1f2!important;
  color:#f47d35!important;
  border:0!important;
  border-top:1px solid rgba(15,23,42,.035)!important;
  border-bottom:1px solid rgba(15,23,42,.045)!important;
  border-radius:0!important;
  box-shadow:none!important;
  text-shadow:none!important;
  font-size:16px!important;
  font-weight:800!important;
  line-height:1.2!important;
  direction:ltr!important;
  text-align:left!important;
  justify-content:flex-start!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-section-title.yf-detail-spec-title,
body.yf-lang-ar .yf-detail-page .yf-detail-section-title.yf-detail-spec-title,
html.yf-lang-ar body .yf-detail-page .yf-detail-section-title.yf-detail-desc-title,
body.yf-lang-ar .yf-detail-page .yf-detail-section-title.yf-detail-desc-title{
  direction:rtl!important;
  text-align:right!important;
  justify-content:flex-end!important;
}
.yf-detail-page .yf-detail-description-section{
  margin-top:8px!important;
  padding:0!important;
  background:#fff!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
.yf-detail-page .yf-detail-about{
  margin:0!important;
  padding:3px 16px 14px!important;
  background:#fff!important;
  border:0!important;
  border-top:0!important;
  box-shadow:none!important;
}
.yf-detail-page .yf-detail-about > :first-child,.yf-detail-page .yf-detail-about .yf-detail-description-text > :first-child{margin-top:0!important;}
.yf-detail-page .yf-detail-images{margin-top:0!important;background:#fff!important;}
.yf-detail-page 
/* Lightbox never contains a page-back control. */

#yfLightbox .yf-lightbox-prev,#yfLightbox .yf-lightbox-next,#yfLightbox .yf-lightbox-close{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  font-size:0!important;
  line-height:0!important;
}
#yfLightbox .yf-lightbox-prev::before,#yfLightbox .yf-lightbox-prev::after,#yfLightbox .yf-lightbox-next::before,#yfLightbox .yf-lightbox-next::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:12px!important;
  height:2.5px!important;
  margin:0!important;
  border:0!important;
  border-radius:2px!important;
  background:#fff!important;
  transform-origin:center!important;
}
#yfLightbox .yf-lightbox-prev::before{transform:translate(-6px,-4px) rotate(-43deg)!important;}
#yfLightbox .yf-lightbox-prev::after{transform:translate(-6px,4px) rotate(43deg)!important;}
#yfLightbox .yf-lightbox-next::before{transform:translate(-6px,-4px) rotate(43deg)!important;}
#yfLightbox .yf-lightbox-next::after{transform:translate(-6px,4px) rotate(-43deg)!important;}
#yfLightbox .yf-lightbox-close::before,#yfLightbox .yf-lightbox-close::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:18px!important;
  height:2.5px!important;
  margin:0!important;
  border:0!important;
  border-radius:2px!important;
  background:#fff!important;
  transform-origin:center!important;
}
#yfLightbox .yf-lightbox-close::before{transform:translate(-50%,-50%) rotate(45deg)!important;}
#yfLightbox .yf-lightbox-close::after{transform:translate(-50%,-50%) rotate(-45deg)!important;}

@media (min-width:768px){
  #yfLightbox .yf-lightbox-prev{left:clamp(26px,3vw,44px)!important;right:auto!important;}
  #yfLightbox .yf-lightbox-next{right:clamp(26px,3vw,44px)!important;left:auto!important;}
  #yfLightbox .yf-lightbox-close{top:clamp(24px,2.6vw,38px)!important;right:clamp(26px,3vw,44px)!important;left:auto!important;}
}
@media (max-width:767px){
  .yf-detail-page .yf-detail-description-section{margin-top:2px!important;}
  .yf-detail-page .yf-detail-section-title.yf-detail-spec-title,.yf-detail-page .yf-detail-section-title.yf-detail-desc-title{
    height:40px!important;
    min-height:40px!important;
    padding:0 12px!important;
    font-size:15px!important;
  }
  .yf-detail-page .yf-detail-about{padding:3px 12px 12px!important;}
  #yfLightbox .yf-lightbox-prev::before,#yfLightbox .yf-lightbox-prev::after,#yfLightbox .yf-lightbox-next::before,#yfLightbox .yf-lightbox-next::after{
    width:11px!important;
    height:2.5px!important;
  }
}


/* QT-102 final cascade audit: force both semantic H2 bars and the description body
   above older high-specificity legacy patches. */
html body .yf-detail-page .yf-detail-info > .yf-detail-section-title.yf-detail-spec-title,html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0 16px!important;
  box-sizing:border-box!important;
  background:#f0f1f2!important;
  color:#f47d35!important;
  border:0!important;
  border-top:1px solid rgba(15,23,42,.035)!important;
  border-bottom:1px solid rgba(15,23,42,.045)!important;
  border-radius:0!important;
  box-shadow:none!important;
  text-shadow:none!important;
  font-size:16px!important;
  font-weight:800!important;
  line-height:1.2!important;
  direction:ltr!important;
  text-align:left!important;
}
html body .yf-detail-page .yf-detail-description-section{
  margin-top:8px!important;
  padding:0!important;
  background:#fff!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
  display:block!important;
  width:100%!important;
  min-height:0!important;
  height:auto!important;
  margin:0!important;
  padding:3px 16px 14px!important;
  background:#fff!important;
  border:0!important;
  border-top:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about > :first-child,html body .yf-detail-page .yf-detail-description-section > .yf-detail-about .yf-detail-description-text > :first-child{
  margin-top:0!important;
}
@media (max-width:767px){
  html body .yf-detail-page .yf-detail-description-section{margin-top:2px!important;}
  html body .yf-detail-page .yf-detail-info > .yf-detail-section-title.yf-detail-spec-title,html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title{
    height:40px!important;
    min-height:40px!important;
    padding:0 12px!important;
    font-size:15px!important;
  }
  html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
    padding:3px 12px 12px!important;
  }
}

/* QT-102 final lightbox close audit: defeat the legacy desktop font-glyph rule.
   The close mark is always exactly two equal CSS bars, never a text character. */
html body #yfLightbox .yf-lightbox-close::before,html body #yfLightbox .yf-lightbox-close::after{
  content:""!important;
  position:absolute!important;
  display:block!important;
  left:50%!important;
  top:50%!important;
  width:18px!important;
  height:2.5px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:2px!important;
  background:#fff!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  transform-origin:center center!important;
  pointer-events:none!important;
}
html body #yfLightbox .yf-lightbox-close::before{
  transform:translate(-50%,-50%) rotate(45deg)!important;
}
html body #yfLightbox .yf-lightbox-close::after{
  transform:translate(-50%,-50%) rotate(-45deg)!important;
}

/* QT-107: scoped Arabic detail-page reading direction.
   Page structure and tier-price columns stay stable; Arabic prose is RTL while
   Latin abbreviations, dimensions, model numbers, currencies and units stay LTR. */
html.yf-lang-ar body .yf-detail-page #yfDetailInfo > h1,html.yf-lang-ar body .yf-detail-page .yf-detail-info > h1,body.yf-lang-ar .yf-detail-page #yfDetailInfo > h1,body.yf-lang-ar .yf-detail-page .yf-detail-info > h1{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}

/* Keep the three summary cells in their established columns (Origin left,
   MOQ centre, Stock right), but make each Arabic label read from the right. */
html.yf-lang-ar body .yf-detail-page .yf-detail-basic,body.yf-lang-ar .yf-detail-page .yf-detail-basic{
  direction:ltr!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div,body.yf-lang-ar .yf-detail-page .yf-detail-basic > div{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-end!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div:first-child,html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div:nth-child(2),html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div:nth-child(3),body.yf-lang-ar .yf-detail-page .yf-detail-basic > div:first-child,body.yf-lang-ar .yf-detail-page .yf-detail-basic > div:nth-child(2),body.yf-lang-ar .yf-detail-page .yf-detail-basic > div:nth-child(3){
  text-align:right!important;
  align-items:flex-end!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div > span:first-child,body.yf-lang-ar .yf-detail-page .yf-detail-basic > div > span:first-child{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-basic > div > b,html.yf-lang-ar body .yf-detail-page .yf-detail-basic .yf-basic-val,html.yf-lang-ar body .yf-detail-page .yf-detail-basic .yf-basic-val b,body.yf-lang-ar .yf-detail-page .yf-detail-basic > div > b,body.yf-lang-ar .yf-detail-page .yf-detail-basic .yf-basic-val,body.yf-lang-ar .yf-detail-page .yf-detail-basic .yf-basic-val b{
  direction:ltr!important;
  unicode-bidi:isolate!important;
  text-align:right!important;
  align-self:flex-end!important;
  white-space:nowrap!important;
}

/* The semantic English H2 stays LTR; only the actual Arabic description copy
   follows RTL and right alignment. */
html.yf-lang-ar body .yf-detail-page .yf-detail-description-text,body.yf-lang-ar .yf-detail-page .yf-detail-description-text{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-description-text p,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text li,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text div,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text h1,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text h2,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text h3,html.yf-lang-ar body .yf-detail-page .yf-detail-description-text h4,body.yf-lang-ar .yf-detail-page .yf-detail-description-text p,body.yf-lang-ar .yf-detail-page .yf-detail-description-text li,body.yf-lang-ar .yf-detail-page .yf-detail-description-text div,body.yf-lang-ar .yf-detail-page .yf-detail-description-text h1,body.yf-lang-ar .yf-detail-page .yf-detail-description-text h2,body.yf-lang-ar .yf-detail-page .yf-detail-description-text h3,body.yf-lang-ar .yf-detail-page .yf-detail-description-text h4{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}
html.yf-lang-ar body .yf-detail-page .yf-detail-description-text [dir="ltr"],body.yf-lang-ar .yf-detail-page .yf-detail-description-text [dir="ltr"],html.yf-lang-ar body .yf-detail-page .yf-detail-description-text .notranslate,body.yf-lang-ar .yf-detail-page .yf-detail-description-text .notranslate{
  direction:ltr!important;
  unicode-bidi:isolate!important;
}

/* Tier prices intentionally keep their current column order and internal LTR
   formatting so ≥, currency, quantities and units cannot be reversed. */
html.yf-lang-ar body .yf-detail-page .yf-detail-price,html.yf-lang-ar body .yf-detail-page .yf-detail-price-item,html.yf-lang-ar body .yf-detail-page .yf-detail-price-item strong,html.yf-lang-ar body .yf-detail-page .yf-detail-price-item span,body.yf-lang-ar .yf-detail-page .yf-detail-price,body.yf-lang-ar .yf-detail-page .yf-detail-price-item,body.yf-lang-ar .yf-detail-page .yf-detail-price-item strong,body.yf-lang-ar .yf-detail-page .yf-detail-price-item span{
  direction:ltr!important;
  unicode-bidi:isolate!important;
}


/* QT-115: supplier-photo viewer uses the same full-screen navigation model as the product lightbox. */

/* QT-115: use one final supplier-product modal geometry from its first painted frame. */

/* Service notices must be above the Factory Contact layer, never behind it. */
html body .yf-success-tip-mask,html body .yf-verification-notice-mask{z-index:2147483647!important}

/* QT-115: detail uses the shared home header geometry. */


/* QT-129: final product-detail composition. Both semantic H2 bars use the home-card
   information background; Product Description is one uninterrupted colour block. */
html body .yf-detail-page .yf-detail-info > .yf-detail-section-title.yf-detail-spec-title,html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title{
  background:#f7f7f7!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section{
  margin-top:3px!important;
  padding:0!important;
  background:#f7f7f7!important;
  border:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
  margin:0!important;
  background:#f7f7f7!important;
  border:0!important;
  border-top:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images{
  margin:0!important;
  background:#f7f7f7!important;
  border:0!important;
}
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    align-items:stretch!important;
    margin-top:0!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    align-self:stretch!important;
    min-height:100%!important;
    height:auto!important;
    box-sizing:border-box!important;
    background:#fff!important;
    border-right:1px solid #e1e4e8!important;
  }
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    border-left:0!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs{
    flex:0 0 auto!important;
    background:#fff!important;
  }
}
@media (max-width:767px){
  html body .yf-detail-page .yf-detail-description-section{margin-top:3px!important}
}


/* QT-137: briefly identify the exact bottom-price row after a direct free/active view. */
.yf-detail-member-cost.yf-cost-just-opened{
  animation:yfCostOpenedPulse 1.6s ease both;
}
@keyframes yfCostOpenedPulse{
  0%,100%{background:inherit}
  35%{background:#fff3e8}
}


/* QT-138 group 2: authoritative detail shell.
   One 3px gutter continues between hero/specifications and thumbnails/service rows.
   Product Description heading and body are one uninterrupted card. */
html body .yf-detail-page .yf-detail-description-section,html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title,html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]),html body .yf-detail-page .yf-detail-description-section > .yf-detail-images{
  background:#f7f7f7!important;
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title{
  margin:0!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about:not(.yf-empty-section):not([hidden]){
  margin:0!important;
}
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    grid-template-columns:52% calc(48% - 3px)!important;
    column-gap:3px!important;
    row-gap:0!important;
    align-items:stretch!important;
    background:#f4f5f6!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    align-self:stretch!important;
    min-width:0!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
    border:0!important;
  }
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
    border:0!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs{
    margin-top:3px!important;
  }
  html body .yf-detail-page .yf-detail-description-section{
    margin-top:3px!important;
  }
}
@media (max-width:767px){
  html body .yf-detail-page .yf-detail-description-section{margin-top:3px!important;}
}


/* Product lightbox is an isolated full-screen viewing mode. */
html.yf-detail-lightbox-open,
html.yf-detail-lightbox-open body{
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
html.yf-detail-lightbox-open body .yf-shared-mobile-header,
html.yf-detail-lightbox-open body #yfWA,
html.yf-detail-lightbox-open body .yf-wa,
html.yf-detail-lightbox-open body .yf-bottom,
html.yf-detail-lightbox-open body .yf-back-to-top,
html.yf-detail-lightbox-open body [data-yf-floating-ui]{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
html.yf-detail-lightbox-open body .yf-detail-page{
  padding-top:0!important;
}
html body #yfLightbox{
  z-index:2147483647!important;
}

/* QT-153: visually balance the desktop gutter around the 1px hero border.
   The structural grid gap is 2px; the hero border makes the upper visual gap 3px.
   The stretched white area below the thumbnails stops 1px early, so its visual gap is also 3px. */
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    grid-template-columns:52% calc(48% - 2px)!important;
    column-gap:2px!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    background:linear-gradient(to right,#fff 0 calc(100% - 2px),#f4f5f6 calc(100% - 2px) 100%)!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-hero,
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs{
    background:#fff!important;
  }
}

/* QT-154: keep the specification row and Product Description on one flat visual plane.
   No panel in this transition may cast a shadow, apply a filter, or create a raised layer. */
html body .yf-detail-page > .yf-detail-content,
html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,
html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
html body .yf-detail-page > .yf-detail-content > .yf-detail-info,
html body .yf-detail-page .yf-detail-description-section,
html body .yf-detail-page .yf-detail-description-section > .yf-detail-section-title.yf-detail-desc-title,
html body .yf-detail-page .yf-detail-description-section > .yf-detail-about,
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images{
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
  text-shadow:none!important;
}
html body .yf-detail-page > .yf-detail-content,
html body .yf-detail-page .yf-detail-description-section{
  position:relative!important;
  z-index:0!important;
}

/* QT-184: thumbnail strip and its right-arrow background stop 2px before the
   gallery edge. This adds the missing 1px to the lower desktop gutter so it
   visually matches the upper gutter created by the hero image border. */
@media(min-width:768px){
  html body .yf-detail-page .yf-detail-gallery>.yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery>.yf-detail-thumbs{
    width:calc(100% - 2px)!important;
    max-width:calc(100% - 2px)!important;
    margin-right:2px!important;
    box-sizing:border-box!important;
    background:#f7f7f7!important;
  }
  html body .yf-detail-page .yf-thumb-arrow-wrap #yfDetailThumbs,
  html body .yf-detail-page .yf-thumb-arrow-wrap .yf-detail-thumbs,
  html body .yf-detail-page #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs{
    background:#f7f7f7!important;
  }
  html body .yf-detail-page #yfDetailThumbs>img,
  html body .yf-detail-page .yf-detail-thumbs>img,
  html body .yf-detail-page #yfDetailThumbs>.yf-detail-thumb-video,
  html body .yf-detail-page .yf-detail-thumbs>.yf-detail-thumb-video{
    background-color:#fff!important;
  }
  html body .yf-detail-page .yf-thumb-arrow{background:#eeeeee!important;}
}

/* QT-179: in mobile detail video mode, keep the close button mirrored to the back button. */
@media (max-width:767px){
  html body .yf-detail-page .yf-detail-hero.video-playing .yf-detail-video-close,
  html body .yf-detail-page .yf-detail-hero.video-playing .yf-detail-video-error-close,
  html body.yf-detail-video-playing .yf-detail-page .yf-detail-hero .yf-detail-video-close,
  html body.yf-detail-video-playing .yf-detail-page .yf-detail-hero .yf-detail-video-error-close{
    position:absolute!important;
    left:auto!important;
    right:10px!important;
    top:40px!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    flex:0 0 34px!important;
    margin:0!important;
    transform:none!important;
    z-index:2147483001!important;
  }
}
@media (min-width:768px){
  html body .yf-detail-page .yf-detail-hero.video-playing .yf-detail-video-close,
  html body .yf-detail-page .yf-detail-hero.video-playing .yf-detail-video-error-close,
  html body.yf-detail-video-playing .yf-detail-page .yf-detail-hero .yf-detail-video-close,
  html body.yf-detail-video-playing .yf-detail-page .yf-detail-hero .yf-detail-video-error-close{
    left:auto!important;
    right:12px!important;
    top:40px!important;
  }
}


/* QT-181: the two semantic H2 headings follow Arabic reading direction. */
html.yf-lang-ar body .yf-detail-page .yf-detail-spec-title,
html.yf-lang-ar body .yf-detail-page .yf-detail-desc-title,
body.yf-lang-ar .yf-detail-page .yf-detail-spec-title,
body.yf-lang-ar .yf-detail-page .yf-detail-desc-title{
  direction:rtl!important;
  unicode-bidi:plaintext!important;
  text-align:right!important;
}

/* QT-181: keep every column's All row as the first visible desktop row.
   Historical category rules used both block and flex geometry; this final rule removes that conflict. */
.yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn,
.yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn.sel,
.yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn:hover,
.yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn:active{
  display:flex!important;
  order:-1!important;
  position:relative!important;
  inset:auto!important;
  visibility:visible!important;
  opacity:1!important;
  flex:0 0 30px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:30px!important;
  min-height:30px!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:visible!important;
}
@media (max-width:767px){
  .yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn,
  .yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn.sel,
  .yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn:hover,
  .yf-sheet.yf-cat-top-panel .yf-cat-col > .yf-cat-all-btn:active{
    flex-basis:29px!important;
    height:29px!important;
    min-height:29px!important;
  }
}

/* QT-192: both desktop columns share one row height. When the parameter card
   has less content, its white background stretches to the gallery/thumbnail baseline. */
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    align-items:stretch!important;
    background:#e5e5e5!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    align-self:stretch!important;
    height:auto!important;
    min-height:0!important;
    background:#fff!important;
  }
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    align-self:stretch!important;
    height:auto!important;
    min-height:0!important;
    background:#fff!important;
  }
  html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service{
    flex:0 0 auto!important;
    margin-bottom:0!important;
  }
}

/* QT-188: image derivatives preserve the complete product. The 192px thumb
   lives in a square white canvas; original-image fallback must also not crop. */
html body .yf-detail-page .yf-detail-main-img,
html body .yf-detail-page #yfDetailThumbs > img,
html body .yf-detail-page .yf-detail-thumbs > img{
  object-fit:contain!important;
  object-position:center center!important;
  background:#fff!important;
}

/* QT-196/QT-198: gallery controls and stable two-column layout.
   Structural gallery separators are centralized later in RELEASE-013. */
@media (min-width:768px){
  html body .yf-detail-page .yf-detail-hero .yf-detail-arrow{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    max-width:34px!important;
    max-height:34px!important;
    border:1px solid rgba(70,70,70,.22)!important;
    background:rgba(255,255,255,.92)!important;
    -webkit-backdrop-filter:blur(6px) saturate(115%)!important;
    backdrop-filter:blur(6px) saturate(115%)!important;
    box-shadow:0 2px 7px rgba(0,0,0,.10)!important;
  }
  html body .yf-detail-page .yf-detail-hero .yf-detail-arrow:active{
    background:rgba(255,255,255,.98)!important;
  }
  html body .yf-detail-page .yf-detail-prev{left:10px!important;}
  html body .yf-detail-page .yf-detail-next{right:10px!important;transform:translateY(-50%) scaleX(-1)!important;}
  html body .yf-detail-page .yf-detail-arrow::before,
  html body .yf-detail-page .yf-detail-arrow::after{
    content:""!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    width:8px!important;
    height:1.8px!important;
    margin:0!important;
    border:0!important;
    border-radius:2px!important;
    background:rgba(25,25,25,.82)!important;
    transform-origin:center!important;
  }
  html body .yf-detail-page .yf-detail-arrow::before{transform:translate(-4px,-3px) rotate(-53deg)!important;}
  html body .yf-detail-page .yf-detail-arrow::after{transform:translate(-4px,3px) rotate(53deg)!important;}

  html body .yf-detail-page > .yf-detail-content{
    grid-template-columns:52% calc(48% - 2px)!important;
    column-gap:2px!important;
    row-gap:0!important;
    background:var(--yf-detail-separator,#e5e5e5)!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-hero{
    width:100%!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
  html body .yf-detail-page .yf-thumb-arrow-wrap #yfDetailThumbs,
  html body .yf-detail-page .yf-thumb-arrow-wrap .yf-detail-thumbs,
  html body .yf-detail-page .yf-detail-thumbs-wrap #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs-wrap .yf-detail-thumbs{
    margin-top:0!important;
    margin-bottom:0!important;
  }
}



/* QT-203: standalone freight-query entry below the detail action bar. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-freight-query{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:44px!important;
  min-height:44px!important;
  margin:6px 0 0!important;
  padding:0 10px!important;
  border:1px solid #f47d35!important;
  border-radius:0!important;
  background:#fff7ed!important;
  color:#d85f1d!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.15!important;
  text-align:center!important;
  cursor:pointer!important;
  box-shadow:none!important;
  transform:none!important;
  overflow:hidden!important;
  -webkit-tap-highlight-color:transparent!important;
  touch-action:manipulation!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-freight-query > .yf-action-label{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  max-width:100%!important;
  line-height:1.15!important;
  white-space:nowrap!important;
  transform:translateY(0)!important;
  transition:transform .10s ease,opacity .10s ease!important;
  pointer-events:none!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-freight-query:active > .yf-action-label{
  transform:translateY(1px)!important;
}
html.yf-lang-ar body .yf-detail-page #yfDetailInfo > .yf-detail-freight-query,
body.yf-lang-ar .yf-detail-page #yfDetailInfo > .yf-detail-freight-query{
  direction:rtl!important;
}

/* QT-204: detail-only container loading calculator. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator{
  box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important;
  width:100%!important;height:44px!important;min-height:44px!important;margin:6px 0 0!important;padding:0 10px!important;
  border:1px solid #f47d35!important;border-radius:0!important;background:#fff!important;color:#d85f1d!important;
  font-size:14px!important;font-weight:800!important;line-height:1.15!important;text-align:center!important;cursor:pointer!important;
  box-shadow:none!important;transform:none!important;overflow:hidden!important;-webkit-tap-highlight-color:transparent!important;touch-action:manipulation!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator > .yf-action-label{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;max-width:100%!important;
  line-height:1.15!important;white-space:nowrap!important;transform:translateY(0)!important;
  transition:transform .10s ease,opacity .10s ease!important;pointer-events:none!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator:active > .yf-action-label{transform:translateY(1px)!important;}
html.yf-lang-ar body .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator,
body.yf-lang-ar .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator{direction:rtl!important;}

html.yf-container-calc-open,body.yf-container-calc-open{overflow:hidden!important;}
.yf-container-calc-mask{position:fixed;inset:0;z-index:100120;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.48);box-sizing:border-box;}
.yf-container-calc-panel{display:flex;flex-direction:column;width:min(780px,100%);max-height:min(90vh,860px);margin:0;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 24px 70px rgba(15,23,42,.24);overflow:hidden;color:#1f2937;text-align:left;}
.yf-container-calc-head{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 46px;min-height:46px;padding:0 52px;background:#f47d35;color:#fff;box-sizing:border-box;}
.yf-container-calc-head h3{margin:0;padding:0;font-size:17px;line-height:1.2;font-weight:800;color:#fff;text-align:center;}
.yf-container-calc-close{position:absolute;top:6px;right:8px;width:34px;height:34px;margin:0;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.18);cursor:pointer;box-shadow:none;}
.yf-container-calc-close::before,.yf-container-calc-close::after{content:"";position:absolute;left:9px;top:16px;width:16px;height:2px;border-radius:2px;background:#fff;}
.yf-container-calc-close::before{transform:rotate(45deg)}.yf-container-calc-close::after{transform:rotate(-45deg)}
.yf-container-calc-body{flex:1 1 auto;min-height:0;padding:16px 18px 12px;overflow:auto;overscroll-behavior:contain;box-sizing:border-box;-webkit-overflow-scrolling:touch;}
.yf-container-calc-product{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:8px;align-items:start;padding:10px 12px;border:1px solid #eceff2;background:#f8fafc;font-size:13px;line-height:1.45;}
.yf-container-calc-product span{color:#6b7280;font-weight:700;}.yf-container-calc-product strong{min-width:0;color:#111827;font-size:14px;font-weight:800;overflow-wrap:anywhere;}
.yf-container-calc-tip{margin:8px 0 14px;color:#6b7280;font-size:12.5px;line-height:1.5;}
.yf-container-calc-section-title{margin:0 0 7px;color:#374151;font-size:13px;font-weight:800;}
.yf-container-calc-grid{display:grid;gap:8px;margin:0 0 9px;}.yf-container-calc-dim-grid{grid-template-columns:repeat(3,minmax(0,1fr));}.yf-container-calc-extra-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.yf-container-calc-grid label{display:block;min-width:0;margin:0;}.yf-container-calc-grid label>span{display:block;min-height:30px;margin:0 0 4px;color:#4b5563;font-size:12px;font-weight:700;line-height:1.3;}
.yf-container-calc-grid input{display:block;width:100%;height:42px;min-height:42px;margin:0;padding:0 10px;border:1px solid #d9dee5;border-radius:7px;background:#fff;color:#111827;font-size:16px;font-weight:700;line-height:40px;outline:none!important;box-shadow:none!important;box-sizing:border-box;-webkit-appearance:none;appearance:none;}
.yf-container-calc-grid input:focus{border-color:#f47d35!important;outline:none!important;box-shadow:none!important;}
.yf-container-calc-price-note{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:2px 0 14px;padding:8px 10px;background:#fff7ed;border-left:3px solid #f47d35;color:#6b4a33;font-size:12px;line-height:1.45;}
.yf-container-calc-price-note span{font-weight:700;}.yf-container-calc-price-note em{font-style:normal;color:#8a5a36;text-align:right;}
.yf-container-calc-result-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px;}.yf-container-calc-result-head strong{font-size:14px;color:#111827;}.yf-container-calc-result-head span{font-size:12.5px;color:#4b5563;white-space:nowrap;}.yf-container-calc-result-head b{color:#d85f1d;}
.yf-container-calc-results{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.yf-container-calc-card{min-width:0;margin:0;border:1px solid #e4e7eb;background:#fff;box-sizing:border-box;}.yf-container-calc-card h4{margin:0;padding:9px 10px;background:#f3f4f6;color:#111827;font-size:14px;font-weight:800;text-align:center;}
.yf-container-calc-card dl{margin:0;padding:4px 10px 8px;}.yf-container-calc-card dl>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid #f0f1f3;}.yf-container-calc-card dl>div:last-child{border-bottom:0;}
.yf-container-calc-card dt{min-width:0;color:#6b7280;font-size:12px;line-height:1.35;}.yf-container-calc-card dd{margin:0;color:#111827;font-size:12.5px;font-weight:800;line-height:1.35;text-align:right;word-break:break-word;}
.yf-container-calc-note{margin:9px 0 0;color:#8a8f98;font-size:11.5px;line-height:1.5;}.yf-container-calc-error{margin:9px 0 0;padding:8px 10px;background:#fff1f2;color:#be123c;font-size:12px;font-weight:700;line-height:1.4;}
html.yf-lang-ar .yf-container-calc-panel,body.yf-lang-ar .yf-container-calc-panel{direction:rtl;text-align:right;}
html.yf-lang-ar .yf-container-calc-close,body.yf-lang-ar .yf-container-calc-close{right:auto;left:8px;}
html.yf-lang-ar .yf-container-calc-price-note em,body.yf-lang-ar .yf-container-calc-price-note em{text-align:left;}
html.yf-lang-ar .yf-container-calc-card dd,body.yf-lang-ar .yf-container-calc-card dd{text-align:left;direction:ltr;}
@media(max-width:767px){
  .yf-container-calc-mask{align-items:flex-end;padding:8px 8px max(8px,env(safe-area-inset-bottom));}
  .yf-container-calc-panel{width:100%;max-height:92vh;border-radius:14px;}
  .yf-container-calc-body{padding:13px 12px 10px;}
  .yf-container-calc-extra-grid{grid-template-columns:1fr;}
  .yf-container-calc-grid label>span{min-height:0;}
  .yf-container-calc-results{grid-template-columns:1fr;}
  .yf-container-calc-price-note{display:block;}.yf-container-calc-price-note em{display:block;margin-top:3px;text-align:left;}
  .yf-container-calc-result-head{align-items:flex-start;}.yf-container-calc-result-head span{white-space:normal;text-align:right;}
}



/* QT-206: video mode is exited through the image thumbnails; no close-video control is shown. */
html body .yf-detail-page .yf-detail-video-close,
html body .yf-detail-page .yf-detail-video-error-close{display:none!important;}


/* QT-209: final detail-page refinements. */
@media(min-width:768px){
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    background:linear-gradient(to right,#fff 0 calc(100% - 8px),var(--yf-detail-separator,#e5e5e5) calc(100% - 8px) 100%)!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs{
    width:calc(100% - 8px)!important;max-width:calc(100% - 8px)!important;margin-right:8px!important;
    box-shadow:0 -2px 0 var(--yf-detail-separator,#e5e5e5),8px 0 0 var(--yf-detail-separator,#e5e5e5)!important;
  }
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-container-calculator,
html body .yf-detail-page #yfDetailInfo > .yf-detail-freight-query{display:none!important;}
.yf-container-calc-head{position:relative!important;height:42px!important;min-height:42px!important;background:var(--yf-brand-orange,#ff6a00)!important;padding:0 54px!important;direction:ltr!important;flex:0 0 42px!important;}
.yf-container-calc-head h3{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:calc(100% - 108px)!important;margin:0!important;text-align:center!important;color:#fff!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.yf-container-calc-close{position:absolute!important;right:8px!important;left:auto!important;top:4px!important;width:34px!important;height:34px!important;background:rgba(255,255,255,.96)!important;box-shadow:0 1px 5px rgba(0,0,0,.10)!important;}
html.yf-lang-ar .yf-container-calc-close,body.yf-lang-ar .yf-container-calc-close{right:8px!important;left:auto!important;}
.yf-container-calc-tip-row{display:block!important;margin:10px 0 12px!important;}
.yf-container-calc-tip-row .yf-container-calc-tip{margin:0!important;min-width:0!important;width:100%!important;}

/* Category child arrows stay close to their labels and sit on the text centreline. */
html body .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child,
html body .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;}
html body .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,
html body .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{position:static!important;flex:0 0 auto!important;margin:0!important;align-self:center!important;transform:translateY(0)!important;}
html.yf-lang-ar body .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child,
html.yf-lang-ar body .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child,
body.yf-lang-ar .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child,
body.yf-lang-ar .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child{flex-direction:row-reverse!important;justify-content:flex-end!important;}
html.yf-lang-ar body .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,
html.yf-lang-ar body .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after,
body.yf-lang-ar .yf-sheet.yf-cat-top-panel .yf-cat-item-l1.has-child::after,
body.yf-lang-ar .yf-sheet.yf-cat-top-panel .yf-cat-item-l2.has-child::after{border-left:0!important;border-right:6px solid #ff6a00!important;margin:0!important;}
html body .yf-container-calc-close::before,html body .yf-container-calc-close::after{background:#111827!important;left:9px!important;top:16px!important;}
html body .yf-container-calc-grid input::-webkit-outer-spin-button,html body .yf-container-calc-grid input::-webkit-inner-spin-button{-webkit-appearance:none!important;margin:0!important;}
html body .yf-container-calc-grid input[type=number]{-moz-appearance:textfield!important;}
html body .yf-product-msg-head .yf-product-msg-back,
html body .yf-service-ui-head .yf-service-back{align-self:center!important;top:auto!important;transform:none!important;margin-top:0!important;}
html body .yf-header-brand .yf-header-brand-text{color:#111827!important;}
html body .yf-service-ui-box .yf-service-ui-head [data-yf-service-close],
html body .yf-product-msg-head .yf-product-msg-close{top:auto!important;align-self:center!important;transform:scale(.9)!important;}

/* QT-2: modal alignment rules continue below; gallery geometry is centralized in RELEASE-013. */
html body .yf-sheet .yf-sheet-head > .yf-sheet-back,
html body .yf-product-msg-head > .yf-product-msg-back{
  top:50%!important;
  transform:translateY(-50%)!important;
  margin-top:0!important;
  align-self:auto!important;
}
html body .yf-service-ui-head button[data-yf-service-close],
html body .yf-sheet .yf-sheet-head > .yf-sheet-close,
html body .yf-product-msg-head > .yf-product-msg-close,
html body .yf-verification-notice-close{
  top:50%!important;
  transform:translateY(-50%) scale(.9)!important;
  margin-top:0!important;
}
html body .yf-product-msg-head,
html body .yf-service-ui-head,
html body .yf-sheet .yf-sheet-head{
  align-items:center!important;
}


/* QT-3: modal chrome rules continue below; gallery geometry is centralized in RELEASE-013. */
html body .yf-product-msg-head,
html body .yf-sheet .yf-sheet-head,
html body .yf-service-ui-head{
  position:relative!important;
  min-height:42px!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding-left:54px!important;
  padding-right:54px!important;
  box-sizing:border-box!important;
}
html body .yf-product-msg-head > span,
html body .yf-sheet .yf-sheet-head > span,
html body .yf-service-ui-head > h3,
html body .yf-service-ui-head > span{
  position:static!important;
  margin:0 auto!important;
  text-align:center!important;
  line-height:42px!important;
}
html body .yf-product-msg-head > .yf-product-msg-back,
html body .yf-sheet .yf-sheet-head > .yf-sheet-back,
html body .yf-service-ui-head .yf-service-back{
  position:absolute!important;
  left:12px!important;
  right:auto!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  margin:0!important;
  width:28px!important;
  height:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
html body .yf-product-msg-head > .yf-product-msg-close,
html body .yf-sheet .yf-sheet-head > .yf-sheet-close,
html body .yf-service-ui-head button[data-yf-service-close],
html body .yf-verification-notice-close{
  position:absolute!important;
  right:8px!important;
  left:auto!important;
  top:50%!important;
  transform:translateY(-50%) scale(.9)!important;
  margin:0!important;
}
html body .yf-shared-mobile-header .yf-header-brand-text,
html body .yf-header-brand .yf-header-brand-text{color:#111827!important;}

/* QT-5: detail page alignment follow-up. */
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head,
html body .yf-product-msg-head{display:grid!important;grid-template-columns:44px minmax(0,1fr)44px!important;align-items:center!important;padding:0 10px!important;}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > span,
html body .yf-product-msg-head > span{grid-column:2!important;text-align:center!important;justify-self:center!important;}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-back,
html body .yf-product-msg-head > .yf-product-msg-back{grid-column:1!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;align-self:center!important;justify-self:start!important;transform:none!important;width:34px!important;height:34px!important;margin:0!important;}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-close,
html body .yf-product-msg-head > .yf-product-msg-close{grid-column:3!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;align-self:center!important;justify-self:end!important;transform:scale(.9)!important;margin:0!important;}
html body .yf-sheet.sheet-about .yf-about-sheet-body,
html body .yf-sheet.sheet-about .yf-about-sheet-scroll{background:#f3f9ff!important;}
html body .yf-product-msg-head{
  display:grid!important;grid-template-columns:42px minmax(0,1fr)42px!important;height:44px!important;min-height:44px!important;padding:0 10px!important;align-items:center!important;
}
html body .yf-product-msg-head > span{grid-column:2!important;text-align:center!important;justify-self:center!important;line-height:44px!important;}
html body .yf-product-msg-head > .yf-product-msg-back{grid-column:1!important;justify-self:start!important;align-self:center!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;margin:0!important;}
html body .yf-product-msg-head > .yf-product-msg-close{grid-column:3!important;justify-self:end!important;align-self:center!important;position:relative!important;left:auto!important;right:auto!important;top:auto!important;transform:scale(.9)!important;margin:0!important;}

/* QT-7 / 香港：详情页只收缩缩略图区下方额外延伸白底，不再移动主图、缩略图或右切灰块。 */
@media(min-width:768px){
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension{
    max-width:none!important;
    margin-right:0!important;
  }
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    right:1px!important;
    width:calc(100% - 1px)!important;
  }
}

/* QT-8: final chrome/extension lock for Hong Kong follow-up. */
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head,
html body .yf-product-msg-head{
  position:relative!important;
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr)44px!important;
  align-items:center!important;
  justify-items:stretch!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 10px!important;
  direction:ltr!important;
}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > span,
html body .yf-product-msg-head > span{
  grid-column:2!important;
  justify-self:center!important;
  align-self:center!important;
  text-align:center!important;
  line-height:44px!important;
  margin:0!important;
  direction:inherit!important;
}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-back,
html body .yf-product-msg-head > .yf-product-msg-back{
  grid-column:1!important;
  justify-self:start!important;
  align-self:center!important;
  position:relative!important;
  inset:auto!important;
  transform:none!important;
  margin:0!important;
  width:34px!important;
  height:34px!important;
}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-close,
html body .yf-product-msg-head > .yf-product-msg-close{
  grid-column:3!important;
  justify-self:end!important;
  align-self:center!important;
  position:relative!important;
  inset:auto!important;
  transform:scale(.9)!important;
  margin:0!important;
  width:34px!important;
  height:34px!important;
}
@media(min-width:768px){
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    right:1px!important;
    width:calc(100% - 1px)!important;
  }
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap{
    transform:none!important;
  }
}


/* QT-9: avoid modal back/close drift after RTL or nested message state changes. */
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head,
html body .yf-product-msg-head{direction:ltr!important;}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-close,
html body .yf-product-msg-head > .yf-product-msg-close{right:auto!important;left:auto!important;}
html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{box-sizing:border-box!important;}

/* QT-10: final detail message/back chrome lock and thumbnail-extension rule.
   Only the extra white extension is shortened; main image, thumbnails and arrow block are untouched. */
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head,
html body .yf-product-msg-head{
  grid-template-columns:40px minmax(0,1fr)40px!important;
  height:44px!important;
  min-height:44px!important;
  direction:ltr!important;
}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-back,
html body .yf-product-msg-head > .yf-product-msg-back{
  grid-column:1!important;
  justify-self:start!important;
  align-self:center!important;
  width:32px!important;
  height:32px!important;
}
html body .yf-sheet.sheet-contact.yf-msg-form-open .yf-sheet-head > .yf-sheet-close,
html body .yf-product-msg-head > .yf-product-msg-close{
  grid-column:3!important;
  justify-self:end!important;
  align-self:center!important;
  width:32px!important;
  height:32px!important;
}
@media(min-width:768px){
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    right:1px!important;
    width:calc(100% - 1px)!important;
  }
}



/* RELEASE-007：手机端详情图片区使用完整屏幕宽度。
   主图为“屏幕宽度 × 屏幕宽度”的正方形显示区；
   非正方形图片使用 contain，空余部分自然留白，不裁切图片。 */
@media(max-width:767px){
  html body .yf-detail-page{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }

  html body .yf-detail-page > .yf-detail-content{
    display:block!important;
    grid-template-columns:none!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery.yf-gallery-extra-bg,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery.has-white-extension{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#fff!important;
    border:0!important;
    box-shadow:none!important;
  }

  html body .yf-detail-page .yf-detail-gallery::after,
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    display:none!important;
    content:none!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-detail-hero{
    display:block!important;
    position:relative!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:1 / 1!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body .yf-detail-page .yf-detail-main-img{
    display:block;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:100%!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    margin:0!important;
    padding:0!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#fff!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs,
  html body .yf-detail-page .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-thumbs-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
    overflow:hidden!important;
    transform:none!important;
    box-sizing:border-box!important;
  }

  html body .yf-detail-page #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs{
    display:flex!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scrollbar-width:none!important;
    -ms-overflow-style:none!important;
    box-sizing:border-box!important;
  }

  html body .yf-detail-page #yfDetailThumbs::-webkit-scrollbar,
  html body .yf-detail-page .yf-detail-thumbs::-webkit-scrollbar{
    display:none!important;
    width:0!important;
    height:0!important;
  }

  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
  }

  /* 旧版本即使残留了节点，也不再显示。 */
  html body .yf-detail-page .yf-detail-source-back,
  html body .yf-detail-page .yf-detail-back{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
}


/* RELEASE-016: the inquiry action row uses the exact same canonical item height as the fixed detail navigation.
   Geometry is CSS-owned; render/layout JavaScript must never write a competing pixel height. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions{
  display:flex!important;
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  overflow:hidden!important;
}
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg,
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact{
  height:var(--yf-detail-nav-item-height,33px)!important;
  min-height:var(--yf-detail-nav-item-height,33px)!important;
  max-height:var(--yf-detail-nav-item-height,33px)!important;
  line-height:var(--yf-detail-nav-item-height,33px)!important;
  padding-top:0!important;
  padding-bottom:0!important;
}


/* RELEASE-012: mobile gallery 2px gutters and description background.
   The thumbnail rail has a 2px gutter above and below.
   The description title/body use the same light-grey plane as the specifications title. */
@media (max-width:767px){
  /* 主图与缩略图之间保留 2px。 */
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs{
    margin-top:2px!important;
  }

  /* 缩略图与商品标题/后续信息之间保留 2px。
     JS 同时写入相同的移动端值，避免旧的内联 margin-top:0 覆盖。 */
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    margin-top:2px!important;
  }

  /* 商品详细描述标题与内容统一为规格标题使用的浅灰底色。 */
  html body .yf-detail-page #yfDetailDescriptionSection,
  html body .yf-detail-page #yfDetailDescriptionSection > .yf-detail-desc-title,
  html body .yf-detail-page #yfDetailDescriptionSection > .yf-detail-about:not(.yf-empty-section):not([hidden]),
  html body .yf-detail-page #yfDetailDescriptionSection > .yf-detail-images{
    background:#f7f7f7!important;
  }

  /* 主图横向手势由脚本处理，纵向仍允许正常滚动页面。 */
  html body .yf-detail-page #yfDetailHero,
  html body .yf-detail-page .yf-detail-hero{
    touch-action:pan-y!important;
    overscroll-behavior-x:contain!important;
  }
}


/* RELEASE-013: canonical gallery separators.
   Desktop:
   1. Keep the established hero-to-parameter grid gap unchanged.
   2. The thumbnail rail and lower grey extension use the full gallery width.
   3. No right-side compensation remains after removing the hero border.
   4. Put a 2px grey line below the thumbnail rail.
   5. Product Description top line is defined in the later-loaded button component.
   6. Thumbnail-to-thumbnail gaps use the same separator grey.
   Mobile keeps RELEASE-012 spacing. */

html body .yf-detail-page{
  --yf-detail-separator:#e5e5e5;
  --yf-detail-thumbnail-plane:#e5e5e5;
}

/* Thumbnail rail and thumbnail gaps use the shared separator grey. */
html body .yf-detail-page #yfDetailThumbs,
html body .yf-detail-page .yf-detail-thumbs{
  gap:2px!important;
  column-gap:2px!important;
  row-gap:0!important;
  padding:0!important;
  background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  background-clip:border-box!important;
}

html body .yf-detail-page #yfDetailThumbs > img,
html body .yf-detail-page .yf-detail-thumbs > img,
html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video,
html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video{
  background:#fff!important;
}

@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    --yf-gallery-edge-adjust:0px;
    display:flex!important;
    flex-direction:column!important;
    align-self:stretch!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }

  /* Main image remains full width; its original gap to the parameter column is unchanged. */
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-hero{
    width:100%!important;
    max-width:100%!important;
    align-self:stretch!important;
    background:#fff!important;
  }

  /* Thumbnail rail: full gallery width; the former 1px right compensation is removed. */
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap{
    align-self:flex-start!important;
    flex:0 0 auto!important;
    box-sizing:border-box!important;
    inline-size:calc(100% - var(--yf-gallery-edge-adjust))!important;
    width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    min-width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    max-width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    margin:2px var(--yf-gallery-edge-adjust) 0 0!important;
    border-right:0!important;
    border-bottom:2px solid var(--yf-detail-separator,#e5e5e5)!important;
    box-shadow:none!important;
  }

  /* Lower grey extension: full width and the same colour as the thumbnail rail. */
  html body .yf-detail-page .yf-detail-gallery-fill{
    display:block!important;
    flex:1 1 0!important;
    flex-basis:0!important;
    align-self:flex-start!important;
    min-height:0!important;
    inline-size:calc(100% - var(--yf-gallery-edge-adjust))!important;
    width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    min-width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    max-width:calc(100% - var(--yf-gallery-edge-adjust))!important;
    margin:0 var(--yf-gallery-edge-adjust) 0 0!important;
    padding:0!important;
    border:0!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  html body .yf-detail-page .yf-thumb-arrow.right,
  html body .yf-detail-page .yf-detail-next{
    right:var(--yf-gallery-edge-adjust)!important;
  }

  html body .yf-detail-page .yf-thumb-arrow{
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }
}

@media (max-width:767px){
  html body .yf-detail-page > .yf-detail-content{
    background:var(--yf-detail-separator,#e5e5e5)!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery.yf-gallery-extra-bg,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery.has-white-extension{
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-detail-hero{
    background:#fff!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap{
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }

  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    background:#fff!important;
  }

  html body .yf-detail-page .yf-thumb-arrow{
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }
}


/* RELEASE-014: container calculator total weight and equal result rows. */
html body .yf-container-calc-card dl{
  padding-top:4px!important;
  padding-bottom:8px!important;
}
html body .yf-container-calc-card dl>div{
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
  box-sizing:border-box!important;
}
html body .yf-container-calc-card dt,
html body .yf-container-calc-card dd{
  display:flex!important;
  align-items:center!important;
  min-height:100%!important;
}
html body .yf-container-calc-card dd{
  justify-content:flex-end!important;
  white-space:nowrap!important;
}
html.yf-lang-ar body .yf-container-calc-card dd,
body.yf-lang-ar .yf-container-calc-card dd{
  justify-content:flex-start!important;
}
/* RELEASE-016: container calculator units and amount emphasis. */
html body .yf-container-calc-card dd[data-field="amount"]{
  color:#d62828!important;
  font-weight:800!important;
}
html body .yf-container-calc-card dd[dir="ltr"]{
  direction:ltr!important;
  unicode-bidi:isolate!important;
}


/* RELEASE-018: one structural desktop baseline for every specification count.
   The two top columns are one stretched grid row. The shorter side grows inside that
   row, while a single 3px separator belongs to the shared parent—not to either child.
   This removes both opposite errors seen in testing:
   - many specifications: the gallery filler appeared lower than the info card;
   - few specifications: the info-card white background appeared higher than thumbnails.
   No parameter-count branch and no measured pixel height are used. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-sample-service,
html body .yf-detail-page .yf-detail-info > .yf-detail-sample-service{
  border-bottom:1px solid #eceff3!important;
}

@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    display:grid!important;
    align-items:stretch!important;
    box-sizing:border-box!important;
    margin-bottom:0!important;
    border-bottom:3px solid var(--yf-detail-separator,#e5e5e5)!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    align-self:stretch!important;
    height:auto!important;
    min-height:0!important;
    margin-bottom:0!important;
    border-bottom:0!important;
    box-sizing:border-box!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    display:flex!important;
    flex-direction:column!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-detail-gallery-fill{
    display:block!important;
    flex:1 1 auto!important;
    min-height:0!important;
    margin-bottom:0!important;
    border-bottom:0!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }

  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
  }

  /* The shared parent already owns the exact 3px line; do not add another gap. */
  html body .yf-detail-page .yf-detail-description-section{
    margin-top:0!important;
    border-top:0!important;
  }
}


/* RELEASE-019: thumbnail rail uses the same grey as the desktop gallery/parameter column gap.
   Thumbnail images, selection outlines and gallery geometry stay unchanged. */
html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap,
html body .yf-detail-page .yf-detail-gallery > #yfDetailThumbs,
html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs,
html body .yf-detail-page .yf-thumb-arrow-wrap > #yfDetailThumbs,
html body .yf-detail-page .yf-detail-thumbs-wrap > #yfDetailThumbs{
  background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
}

/* RELEASE-021: one inner-baseline for desktop gallery and specification cards.
   The content box of .yf-detail-content is the only baseline. Both top columns
   stretch to that same inner edge; the parent then draws one shared 3px divider.
   No thumbnail rail, filler, service row, or info card may contribute another
   bottom border. This keeps few-parameter and many-parameter products aligned. */
@media (min-width:768px){
  html body .yf-detail-page{
    --yf-detail-separator:#e5e5e5;
  }

  html body .yf-detail-page > .yf-detail-content{
    display:grid!important;
    align-items:stretch!important;
    box-sizing:border-box!important;
    margin-bottom:0!important;
    padding-bottom:0!important;
    border-bottom:3px solid var(--yf-detail-separator)!important;
    background:var(--yf-detail-separator)!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery,
  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    align-self:stretch!important;
    height:auto!important;
    min-height:0!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding-bottom:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
  }

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    display:flex!important;
    flex-direction:column!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
  }

  html body .yf-detail-page > .yf-detail-content > #yfDetailInfo,
  html body .yf-detail-page > .yf-detail-content > .yf-detail-info{
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
  }

  /* Thumbnail rail is visual content, not a second baseline. */
  html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap,
  html body .yf-detail-page .yf-detail-gallery > #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs,
  html body .yf-detail-page .yf-thumb-arrow-wrap > #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs-wrap > #yfDetailThumbs{
    border-bottom:0!important;
    box-shadow:none!important;
    margin-bottom:0!important;
    padding-bottom:0!important;
  }

  /* The gallery filler alone consumes any spare height on the image side. */
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-gallery-fill{
    display:block!important;
    flex:1 1 0!important;
    min-height:0!important;
    margin-top:0!important;
    margin-bottom:0!important;
    padding:0!important;
    border:0!important;
    box-shadow:none!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
    box-sizing:border-box!important;
  }

  /* No child pseudo-extension may create a second lower edge. */
  html body .yf-detail-page .yf-detail-gallery::after,
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    bottom:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }

  /* The parent divider already provides the exact 3px transition. */
  html body .yf-detail-page .yf-detail-description-section{
    margin-top:0!important;
    border-top:0!important;
  }
}

/* RELEASE-022: final thumbnail spacing and lower white extension.
   1. The runtime-owned horizontal thumbnail gap is reduced from 4px to 3px.
   2. When the gallery must stretch to match a taller specification card, the existing
      grey filler remains the base plane. A white layer covers it from 3px below the
      thumbnail rail to the shared bottom baseline. Its left and right edges use the
      exact same width as the thumbnail-arrow rail, including the established 1px
      right recess. No gallery-level legacy pseudo-extension is allowed to compete. */
html body .yf-detail-page #yfDetailThumbs,
html body .yf-detail-page .yf-detail-thumbs{
  gap:3px!important;
  column-gap:3px!important;
  row-gap:0!important;
}

@media (min-width:768px){
  html body .yf-detail-page .yf-detail-gallery > .yf-detail-gallery-fill{
    position:relative!important;
    isolation:isolate!important;
    background:var(--yf-detail-thumbnail-plane,#e5e5e5)!important;
    overflow:hidden!important;
  }

  html body .yf-detail-page .yf-detail-gallery > .yf-detail-gallery-fill::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    top:3px!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:#fff!important;
    box-shadow:none!important;
    pointer-events:none!important;
  }

  html body .yf-detail-page .yf-detail-gallery::after,
  html body .yf-detail-page .yf-detail-gallery.yf-gallery-extra-bg::after,
  html body .yf-detail-page .yf-detail-gallery.has-white-extension::after{
    content:none!important;
    display:none!important;
  }
}



/* RELEASE-023: lower white inset and thumbnail-arrow contrast.
   The white lower extension begins 3px below the thumbnail rail.
   Arrow buttons use a slightly darker neutral grey so their hit areas remain visible
   against the thumbnail plane without changing dimensions or the established 1px recess. */
html body .yf-detail-page .yf-thumb-arrow{
  background:#cfd3d8!important;
}


/* RELEASE-024: unify all structural detail-page greys.
   The hero/specification divider, thumbnail plane, thumbnail gaps, lower gallery filler,
   and the Product Description top divider all use the same #e5e5e5 neutral grey.
   Thumbnail navigation buttons remain intentionally darker for visual affordance. */
html body .yf-detail-page{
  --yf-detail-separator:#e5e5e5!important;
  --yf-detail-thumbnail-plane:#e5e5e5!important;
}
html body .yf-detail-page #yfDetailThumbs,
html body .yf-detail-page .yf-detail-thumbs,
html body .yf-detail-page .yf-detail-gallery,
html body .yf-detail-page .yf-detail-gallery > .yf-detail-gallery-fill,
html body .yf-detail-page .yf-detail-gallery > .yf-thumb-arrow-wrap,
html body .yf-detail-page .yf-detail-gallery > .yf-detail-thumbs-wrap{
  background-color:#e5e5e5!important;
}
html body .yf-detail-page .yf-thumb-arrow{
  background:#cfd3d8!important;
}

/* RELEASE-025: detail-description image separators use the same grey as the
   home-page product image grid. Existing 2px spacing is unchanged; only the
   colour visible inside those gaps is locked to #dedede. */
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images:not(.yf-empty-section):not([hidden]){
  background:#dedede!important;
}
html body .yf-detail-page .yf-detail-description-section > .yf-detail-images img{
  background:#fff!important;
}


/* RELEASE-059: remove the visible pale outer ring from the container calculator.
   The popup shell itself owns the 14px curve; no 1px light border is drawn around it. */
html body .yf-container-calc-panel{
  border:0!important;
  outline:0!important;
  background-clip:border-box!important;
}

/* RELEASE-025: mobile WhatsApp is pinned flush to the right edge and moves vertically only. */
@media (max-width:767px){
  html body #yfWA.yf-wa,
  html body .yf-wa#yfWA{
    right:0!important;
    left:auto!important;
    touch-action:none!important;
  }
}


/* RELEASE-031: mobile container calculator follows the visible viewport when
   the software keyboard opens. The header stays reachable while only the body
   scroll area contracts, matching the mobile account-application dialog. */
@media (max-width:767px){
  html body .yf-container-calc-mask{
    align-items:flex-start!important;
    justify-content:center!important;
    padding:8px 8px max(8px,env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html body .yf-container-calc-panel{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-height:calc(100dvh - 16px)!important;
    margin:0!important;
    overflow:hidden!important;
  }
  html body .yf-container-calc-head{
    position:relative!important;
    z-index:2!important;
    flex:0 0 44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }
  html body .yf-container-calc-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:max(18px,env(safe-area-inset-bottom))!important;
  }
}

/* RELEASE-034: mobile About Us keeps its chrome reachable.
   The sheet shell is viewport-bounded; the orange header and close control never
   leave the visible area, while only the content region scrolls. */
@media (max-width:767px){
  html body #yfSheet.yf-sheet.sheet-about.show,
  html body .yf-sheet.sheet-about.show{
    overflow:hidden!important;
    max-height:none!important;
    border-radius:14px!important;
  }
  html body .yf-sheet.sheet-about .yf-sheet-head{
    position:relative!important;
    z-index:4!important;
    flex:0 0 44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }
  html body .yf-sheet.sheet-about .yf-about-sheet-body{
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  html body .yf-sheet.sheet-about .yf-about-sheet-scroll{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body .yf-sheet.sheet-about .yf-about-sheet-actions{
    flex:0 0 auto!important;
    position:relative!important;
    z-index:3!important;
  }
}


/* Mobile detail thumbnails: canonical geometry and selected-state rule.
   The rail owns one extra pixel below the 67px thumbnail, so iPhone Safari never clips
   the lower edge of the 1px active frame. Selection is class/ARIA driven only; JavaScript
   no longer writes border styles inline. Desktop behavior is untouched. */
@media (max-width:767px){
  html body .yf-detail-page .yf-thumb-arrow-wrap,
  html body .yf-detail-page .yf-detail-thumbs-wrap{
    margin-top:4px!important;
    height:70px!important;
    min-height:70px!important;
    max-height:70px!important;
    padding-top:0!important;
    padding-bottom:2px!important;
    box-sizing:border-box!important;
    align-items:flex-start!important;
    overflow-x:hidden!important;
    overflow-y:hidden!important;
  }

  html body .yf-detail-page #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs{
    margin-top:0!important;
    height:68px!important;
    min-height:68px!important;
    max-height:68px!important;
    padding:0!important;
    align-items:flex-start!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    box-sizing:border-box!important;
  }

  html body .yf-detail-page #yfDetailThumbs > img,
  html body .yf-detail-page .yf-detail-thumbs > img,
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video,
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video{
    display:block!important;
    height:67px!important;
    min-height:67px!important;
    max-height:67px!important;
    margin:0!important;
    border:1px solid transparent!important;
    outline:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    position:relative!important;
    z-index:0!important;
  }

  html body .yf-detail-page #yfDetailThumbs > img:hover:not(.sel):not([aria-current="true"]),
  html body .yf-detail-page .yf-detail-thumbs > img:hover:not(.sel):not([aria-current="true"]),
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video:hover:not(.sel):not([aria-current="true"]),
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video:hover:not(.sel):not([aria-current="true"]){
    border-color:transparent!important;
    outline:0!important;
    box-shadow:none!important;
  }

  html body .yf-detail-page #yfDetailThumbs > img.sel,
  html body .yf-detail-page #yfDetailThumbs > img[aria-current="true"],
  html body .yf-detail-page .yf-detail-thumbs > img.sel,
  html body .yf-detail-page .yf-detail-thumbs > img[aria-current="true"],
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video.sel,
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video[aria-current="true"],
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video.sel,
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video[aria-current="true"]{
    border-color:#ff6a00!important;
    outline:0!important;
    box-shadow:none!important;
    z-index:2!important;
  }
}

/* 2026-07-15: keep all three detail action labels exactly aligned with the top navigation typography. */
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg,
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact,
html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > button > .yf-action-label{
  font-size:13px!important;
  font-weight:700!important;
}
@media (max-width:767px){
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-interested,
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-product-msg,
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > .yf-detail-factory-contact,
  html body .yf-detail-page #yfDetailInfo > .yf-detail-actions > button > .yf-action-label{
    font-size:10.5px!important;
    font-weight:700!important;
    letter-spacing:0!important;
  }
}


/* FINAL-20260716: mobile thumbnail selection and page alignment.
   Unselected thumbnails have no frame. The active thumbnail uses an inset 1px orange outline,
   which cannot be clipped by the horizontal rail. */
@media (max-width:767px){
  html body .yf-detail-page #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs{
    gap:3px!important;
    background:#e5e5e5!important;
  }
  html body .yf-detail-page #yfDetailThumbs > img,
  html body .yf-detail-page .yf-detail-thumbs > img,
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video,
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video{
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background-clip:padding-box!important;
  }
  html body .yf-detail-page #yfDetailThumbs > img.sel,
  html body .yf-detail-page #yfDetailThumbs > img[aria-current="true"],
  html body .yf-detail-page .yf-detail-thumbs > img.sel,
  html body .yf-detail-page .yf-detail-thumbs > img[aria-current="true"],
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video.sel,
  html body .yf-detail-page #yfDetailThumbs > .yf-detail-thumb-video[aria-current="true"],
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video.sel,
  html body .yf-detail-page .yf-detail-thumbs > .yf-detail-thumb-video[aria-current="true"]{
    border:0!important;
    outline:1px solid #ff6a00!important;
    outline-offset:-1px!important;
    box-shadow:none!important;
  }
}

/* 2026-07-16 desktop detail content edges.
   Keep the upper main row borders unchanged. Continue the same 2px inward
   dividers over the description H2, description text and every detail image.
   The continuation is painted above child backgrounds and ends with the
   description section's final real content. */
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    border-left:2px solid #e5e5e5!important;
    border-right:2px solid #e5e5e5!important;
    box-sizing:border-box!important;
  }
  html body .yf-detail-page > .yf-detail-description-section{
    position:relative!important;
    box-sizing:border-box!important;
    border-left:0!important;
    border-right:0!important;
  }
  html body .yf-detail-page > .yf-detail-description-section::before,
  html body .yf-detail-page > .yf-detail-description-section::after{
    content:""!important;
    position:absolute!important;
    top:-3px!important;
    bottom:0!important;
    width:2px!important;
    background:#e5e5e5!important;
    pointer-events:none!important;
    z-index:20!important;
  }
  html body .yf-detail-page > .yf-detail-description-section::before{left:0!important;}
  html body .yf-detail-page > .yf-detail-description-section::after{right:0!important;}
}


/* YF collection-only contact mode */
.yf-contact-body.yf-collection-only .yf-contact-scroll{margin-bottom:0!important;}
.yf-contact-actions.yf-collection-actions{display:block!important;width:100%!important;}
.yf-contact-actions.yf-collection-actions .yf-interest-download{display:block!important;width:100%!important;margin:0!important;}

/* 2026-07-16 desktop detail: extend only the three vertical dividers upward by 1px.
   Keep the navigation, main image, parameter panel and all established spacing unchanged. */
@media (min-width:768px){
  html body .yf-detail-page > .yf-detail-content{
    position:relative!important;
  }
  html body .yf-detail-page > .yf-detail-content::before,
  html body .yf-detail-page > .yf-detail-content::after{
    content:""!important;
    position:absolute!important;
    top:-1px!important;
    width:2px!important;
    height:1px!important;
    background:#e5e5e5!important;
    pointer-events:none!important;
    z-index:30!important;
  }
  html body .yf-detail-page > .yf-detail-content::before{left:-2px!important;}
  html body .yf-detail-page > .yf-detail-content::after{right:-2px!important;}

  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery{
    position:relative!important;
  }
  html body .yf-detail-page > .yf-detail-content > .yf-detail-gallery::before{
    content:""!important;
    position:absolute!important;
    top:-1px!important;
    right:-1px!important;
    width:1px!important;
    height:1px!important;
    background:#e1e4e8!important;
    pointer-events:none!important;
    z-index:30!important;
  }
}

/* 2026-07-16 mobile detail thumbnail rail vertical alignment.
   Keep desktop geometry, thumbnail size, arrow size and active orange frame unchanged.
   The mobile-only thumbnail track had a 2px lower visual baseline from nested rail sizing;
   lift only that track so its top/bottom edges align with both arrow hit areas. */
@media (max-width:767px){
  html body .yf-detail-page .yf-thumb-arrow-wrap > #yfDetailThumbs,
  html body .yf-detail-page .yf-thumb-arrow-wrap > .yf-detail-thumbs,
  html body .yf-detail-page .yf-detail-thumbs-wrap > #yfDetailThumbs,
  html body .yf-detail-page .yf-detail-thumbs-wrap > .yf-detail-thumbs{
    position:relative!important;
    top:-2px!important;
    transform:none!important;
  }
}

/* 2026-07-17: tighten Product Inquiry field spacing and compact Container Calculator inputs. */
html body .yf-product-msg-box .yf-product-msg-error:empty{
  display:none!important;
  min-height:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
}
html body .yf-product-msg-box .yf-product-msg-contact-wrap{
  margin-bottom:8px!important;
}
html body .yf-product-msg-box .yf-product-msg-body > textarea{
  margin:0!important;
}

html body .yf-container-calc-grid{
  row-gap:6px!important;
  column-gap:8px!important;
  margin-bottom:8px!important;
}
html body .yf-container-calc-grid label>span{
  min-height:0!important;
  height:auto!important;
  margin:0 0 5px!important;
  line-height:1.25!important;
}