/*
 * Comercios Header V281
 * Matriz visual: Automotores V9 / Microsite Base V1.5.
 * Alcance: archivo principal de Comercios. No modifica single-comercio.php.
 */
.jc-commerce-header-v281,
.jc-commerce-header-v281 *{box-sizing:border-box}
.jc-commerce-header-v281{
  position:relative;
  z-index:40;
  width:100%;
  margin:0;
  border-bottom:1px solid #dce6ef;
  background:#fff;
  box-shadow:0 4px 14px rgba(20,54,89,.06);
}
.jc-commerce-header-v281__row{
  width:min(1024px,calc(100% - 24px));
  min-height:90px;
  margin:0 auto;
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 142px;
  align-items:center;
  gap:12px;
  padding:5px 0;
}
.jc-commerce-header-v281__back{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:12px;
  color:#234d75;
  text-decoration:none;
}
.jc-commerce-header-v281__back:hover,
.jc-commerce-header-v281__back:focus-visible{background:#eef5fb;color:#0d5cab;outline:none}
.jc-commerce-header-v281__back svg{width:21px;height:21px}
.jc-commerce-header-v281__brands{
  min-width:0;
  height:80px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:center;
  gap:14px;
  overflow:hidden;
}
.jc-commerce-header-v281__brand{
  width:100%;
  max-width:230px;
  height:78px;
  min-width:0;
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  text-decoration:none;
  transition:background .18s ease,transform .18s ease;
}
.jc-commerce-header-v281__brand:hover,
.jc-commerce-header-v281__brand:focus-visible{background:#f6f9fc;transform:translateY(-1px);outline:none}
.jc-commerce-header-v281__brand img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
}
.jc-commerce-header-v281__publish{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  justify-self:end;
  padding:0 17px;
  border:1px solid #e87400;
  border-radius:12px;
  background:linear-gradient(180deg,#ff9500,#ff7a00);
  box-shadow:0 7px 18px rgba(255,133,0,.18);
  color:#fff;
  text-decoration:none;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.jc-commerce-header-v281__publish:hover,
.jc-commerce-header-v281__publish:focus-visible{transform:translateY(-1px);box-shadow:0 10px 22px rgba(255,133,0,.24);outline:none}

/* El cuerpo de Comercios comienza inmediatamente debajo del header compacto. */
.jc-commerce-directory--v3>.jc-commerce-v3--directory-body{padding-top:12px}

@media(max-width:620px){
  .jc-commerce-header-v281__row{
    width:100%;
    min-height:62px;
    grid-template-columns:44px minmax(0,1fr) 86px;
    gap:3px;
    padding:2px 5px;
  }
  .jc-commerce-header-v281__back{width:42px;height:42px;border-radius:11px}
  .jc-commerce-header-v281__back svg{width:18px;height:18px}
  .jc-commerce-header-v281__brands{height:56px;gap:4px}
  .jc-commerce-header-v281__brand{width:100%;max-width:128px;height:54px;border-radius:7px}
  .jc-commerce-header-v281__publish{min-height:38px;padding:0 8px;border-radius:10px;font-size:9px}
  .jc-commerce-directory--v3>.jc-commerce-v3--directory-body{padding-top:8px}
}

@media(max-width:360px){
  .jc-commerce-header-v281__row{grid-template-columns:42px minmax(0,1fr) 78px;padding-inline:2px}
  .jc-commerce-header-v281__brands{gap:4px}
  .jc-commerce-header-v281__brand{width:100%;max-width:128px;height:52px}
  .jc-commerce-header-v281__publish{padding-inline:6px;font-size:8.2px}
}

@media(prefers-reduced-motion:reduce){
  .jc-commerce-header-v281__brand,
  .jc-commerce-header-v281__publish{transition:none!important}
}