/* Sprint 918 — Full shopping-page commerce redesign
   Palette: direct black + direct yellow + white. No theme-derived yellows. */

.tf-shopping-commerce-panel{
  margin-top:14px!important;
  border:1px solid #D7DEE6!important;
  border-radius:16px!important;
  background:#FFFFFF!important;
  overflow:hidden!important;
  box-shadow:0 14px 34px rgba(7,22,38,.07)!important
}

/* benefits: shopping trust strip */
.tf-shopping-benefits{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  background:#FFFFFF!important;
  border-bottom:1px solid #E5EAF0!important
}
.tf-shopping-benefits article{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-height:82px!important;
  padding:14px 18px!important;
  border-right:1px solid #E5EAF0!important
}
.tf-shopping-benefits article:last-child{border-right:0!important}
.tf-shopping-benefit-icon{
  display:grid!important;
  place-items:center!important;
  width:48px!important;height:48px!important;
  flex:0 0 48px!important;
  border-radius:12px!important;
  background:#F4B400!important;
  color:#101820!important
}
.tf-shopping-benefit-icon svg{width:25px!important;height:25px!important}
.tf-shopping-benefits b{
  display:block!important;
  color:#101820!important;
  font-size:10px!important;
  font-weight:900!important
}
.tf-shopping-benefits article div>span{
  display:block!important;
  margin-top:3px!important;
  color:#68798A!important;
  font-size:7px!important
}

/* payment row */
.tf-shopping-payment-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
  padding:14px 18px!important;
  background:#FAFBFC!important;
  border-bottom:1px solid #E5EAF0!important
}
.tf-shopping-payment-title{
  display:flex!important;
  align-items:center!important;
  gap:10px!important
}
.tf-black-icon-box{
  display:grid!important;
  place-items:center!important;
  width:40px!important;height:40px!important;
  flex:0 0 40px!important;
  border-radius:10px!important;
  background:#101820!important;
  color:#F4B400!important
}
.tf-black-icon-box svg{width:21px!important;height:21px!important}
.tf-shopping-payment-title b{
  display:block!important;color:#101820!important;font-size:9px!important;font-weight:900!important
}
.tf-shopping-payment-title div>span{
  display:block!important;margin-top:2px!important;color:#748596!important;font-size:6.5px!important
}
.tf-shopping-payment-methods{
  display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;flex-wrap:wrap!important
}
.tf-shopping-payment-methods>span{
  display:inline-flex!important;align-items:center!important;gap:6px!important;
  min-height:34px!important;padding:0 10px!important;
  border:1px solid #CBD5DF!important;border-radius:8px!important;
  background:#FFFFFF!important;color:#101820!important;
  font-size:7px!important;font-weight:900!important
}
.tf-shopping-payment-methods svg{width:15px!important;height:15px!important;color:#F4B400!important}

/* dispatch header */
.tf-shopping-dispatch-bar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  min-height:74px!important;
  padding:12px 18px!important;
  background:#101820!important;
  color:#FFFFFF!important
}
.tf-shopping-dispatch-left{display:flex!important;align-items:center!important;gap:11px!important}
.tf-yellow-clock{
  display:grid!important;place-items:center!important;
  width:42px!important;height:42px!important;flex:0 0 42px!important;
  border-radius:50%!important;background:#F4B400!important;color:#101820!important
}
.tf-yellow-clock svg{width:23px!important;height:23px!important}
.tf-shopping-dispatch-left b{
  display:block!important;color:#FFFFFF!important;font-size:10px!important;font-weight:900!important
}
.tf-shopping-dispatch-left div>span{
  display:block!important;margin-top:3px!important;color:#C9D2DB!important;font-size:7px!important;line-height:1.35!important
}
.tf-shopping-live{
  display:inline-flex!important;align-items:center!important;gap:6px!important;
  padding:7px 10px!important;border-radius:999px!important;
  background:#1B2734!important;color:#FFFFFF!important;font-size:6.5px!important;font-weight:900!important
}
.tf-shopping-live i{width:8px!important;height:8px!important;border-radius:50%!important;background:#F4B400!important}

/* main 3-step shopping timeline */
.tf-shopping-steps{
  display:grid!important;grid-template-columns:repeat(3,1fr)!important;background:#FFFFFF!important
}
.tf-shopping-steps article{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:13px!important;
  min-height:126px!important;padding:20px!important;border-right:1px solid #E5EAF0!important
}
.tf-shopping-steps article:last-child{border-right:0!important}
.tf-shopping-step-icon{
  display:grid!important;place-items:center!important;
  width:64px!important;height:64px!important;flex:0 0 64px!important;
  border-radius:50%!important;background:#F4B400!important;color:#101820!important
}
.tf-shopping-step-icon svg{width:31px!important;height:31px!important}
.tf-shopping-steps strong{
  display:block!important;margin-bottom:4px!important;color:#F4B400!important;
  font-size:7px!important;font-weight:900!important;letter-spacing:.06em!important
}
.tf-shopping-steps b{
  display:block!important;color:#101820!important;font-size:10px!important;font-weight:900!important
}
.tf-shopping-steps article div>span{
  display:block!important;margin-top:4px!important;color:#6C7E90!important;font-size:7px!important;line-height:1.35!important
}

/* extra shopping service strip */
.tf-shopping-service-strip{
  display:grid!important;grid-template-columns:repeat(3,1fr)!important;
  background:#101820!important;border-top:1px solid #101820!important
}
.tf-shopping-service-strip article{
  display:flex!important;align-items:center!important;gap:10px!important;
  min-height:68px!important;padding:12px 16px!important;border-right:1px solid #2A3440!important
}
.tf-shopping-service-strip article:last-child{border-right:0!important}
.tf-shopping-service-strip article>span{
  display:grid!important;place-items:center!important;width:34px!important;height:34px!important;flex:0 0 34px!important;
  border-radius:9px!important;background:#F4B400!important;color:#101820!important
}
.tf-shopping-service-strip svg{width:18px!important;height:18px!important}
.tf-shopping-service-strip b{display:block!important;color:#FFFFFF!important;font-size:8px!important;font-weight:900!important}
.tf-shopping-service-strip small{display:block!important;margin-top:2px!important;color:#AEBAC5!important;font-size:6.5px!important}

/* sharing */
.tf-shopping-share-row{
  display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;
  padding:14px 18px!important;background:#FFFFFF!important
}
.tf-shopping-share-row>div:first-child b{
  display:block!important;color:#101820!important;font-size:8px!important;font-weight:900!important
}
.tf-shopping-share-row>div:first-child span{
  display:block!important;margin-top:2px!important;color:#728496!important;font-size:6.5px!important
}
.tf-shopping-share-actions{display:flex!important;align-items:center!important;gap:8px!important}
.tf-shopping-share-actions button,.tf-shopping-share-actions a{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  min-height:38px!important;padding:0 12px!important;border-radius:8px!important;
  text-decoration:none!important;font-size:7px!important;font-weight:900!important
}
.tf-shopping-share-actions button{
  border:1px solid #101820!important;background:#FFFFFF!important;color:#101820!important
}
.tf-shopping-share-actions svg{width:17px!important;height:17px!important}
.tf-whatsapp-button{
  border:1px solid #25D366!important;background:#25D366!important;color:#FFFFFF!important
}
.tf-whatsapp-button svg{color:#FFFFFF!important}

@media(max-width:760px){
  .tf-shopping-benefits,.tf-shopping-steps,.tf-shopping-service-strip{grid-template-columns:1fr!important}
  .tf-shopping-benefits article,.tf-shopping-steps article,.tf-shopping-service-strip article{
    justify-content:flex-start!important;border-right:0!important;border-bottom:1px solid #E5EAF0!important
  }
  .tf-shopping-service-strip article{border-bottom-color:#2A3440!important}
  .tf-shopping-payment-row,.tf-shopping-dispatch-bar,.tf-shopping-share-row{
    align-items:flex-start!important;flex-direction:column!important
  }
  .tf-shopping-payment-methods{justify-content:flex-start!important}
  .tf-shopping-share-actions{width:100%!important}
  .tf-shopping-share-actions button,.tf-shopping-share-actions a{flex:1!important}
}

/* no gradients */