/* =========================================================
   v4.5.3.11.6 · Responsive final de Gestión > Tienda Online
   Alcance visual únicamente:
   - header móvil más compacto sin alterar la identidad/logo;
   - Productos publicados sin depender de nth-child históricos;
   - controles legibles, sin cruces ni scroll horizontal.
   ========================================================= */

/* La tarjeta y sus piezas nunca deben forzar un ancho mayor al disponible. */
#storeAdmin .store-products-card,
#storeAdmin .store-products-head,
#storeAdmin .store-product-filters-v453111,
#storeAdmin .store-products-toolbar,
#storeAdmin .store-products-table-head,
#storeAdmin .store-product-list,
#storeAdmin .store-product-admin-row,
#storeAdmin .store-product-admin-main,
#storeAdmin .store-product-admin-copy,
#storeAdmin .store-product-control-cell{
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

@media(max-width:760px){
  /* Cabecera del bloque: búsqueda y texto siempre dentro de la tarjeta. */
  #storeAdmin .store-products-card{
    width:100%;
    overflow:visible;
  }
  #storeAdmin .store-products-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
    align-items:start!important;
  }
  #storeAdmin .store-products-head>div{
    min-width:0;
  }
  #storeAdmin .store-product-search{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  #storeAdmin .store-products-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:4px!important;
    align-items:start!important;
  }
  #storeAdmin .store-products-toolbar>span,
  #storeAdmin .store-products-toolbar>small{
    min-width:0;
    max-width:100%;
    overflow-wrap:anywhere;
  }

  /*
     La estructura móvil anterior dependía del número de hijo de cada celda.
     Desde .11.2 ya no existe Disponible, por eso esos nth-child quedaron
     desfasados. Esta versión posiciona cada control por su clase real.
  */
  #storeAdmin .store-product-admin-row{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-auto-flow:row!important;
    gap:0!important;
    padding:0 12px 10px!important;
    overflow:hidden!important;
    border-radius:18px!important;
    align-items:stretch!important;
  }

  #storeAdmin .store-product-admin-main{
    grid-column:1/-1!important;
    grid-row:auto!important;
    display:flex!important;
    align-items:center!important;
    gap:11px!important;
    width:100%!important;
    padding:12px 0 11px!important;
    margin:0!important;
    border-bottom:1px solid var(--line)!important;
  }
  #storeAdmin .store-product-admin-image{
    flex:0 0 48px!important;
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    border-radius:13px!important;
    overflow:hidden!important;
  }
  #storeAdmin .store-product-admin-copy{
    flex:1 1 auto!important;
    width:auto!important;
    overflow:hidden!important;
  }
  #storeAdmin .store-product-admin-copy strong,
  #storeAdmin .store-product-admin-copy small,
  #storeAdmin .store-product-admin-copy span{
    display:block!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
  #storeAdmin .store-product-admin-copy strong{
    font-size:.88rem!important;
    line-height:1.25!important;
  }
  #storeAdmin .store-product-admin-copy small,
  #storeAdmin .store-product-admin-copy span{
    font-size:.75rem!important;
    line-height:1.3!important;
  }

  /* Reset de los bordes/posiciones históricos. */
  #storeAdmin .store-product-control-cell{
    grid-row:auto!important;
    min-height:70px!important;
    width:100%!important;
    padding:9px 8px!important;
    margin:0!important;
    border-top:0!important;
    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    text-align:center!important;
    overflow:hidden!important;
  }

  /* Fila 1: Orden | Visible. */
  #storeAdmin .store-order-cell-v4521{
    grid-column:1!important;
    border-right:1px solid var(--line)!important;
  }
  #storeAdmin .store-product-control-cell:has(.store-visibility-toggle){
    grid-column:2!important;
  }

  /* Fila 2: Destacado | Promoción. */
  #storeAdmin .store-product-control-cell:has(.store-featured-toggle){
    grid-column:1!important;
    border-top:1px solid var(--line)!important;
    border-right:1px solid var(--line)!important;
  }
  #storeAdmin .store-promotion-cell-v4522{
    grid-column:2!important;
    border-top:1px solid var(--line)!important;
  }

  /* El nombre del control va arriba; la acción queda debajo. */
  #storeAdmin .store-control-mobile-label{
    display:block!important;
    order:-1!important;
    width:100%!important;
    margin:0!important;
    color:var(--muted)!important;
    font-size:.64rem!important;
    font-weight:900!important;
    line-height:1.1!important;
    letter-spacing:.075em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  #storeAdmin .store-order-buttons-v4521{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
  }
  #storeAdmin .store-order-buttons-v4521 button{
    flex:0 0 36px!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    padding:0!important;
  }

  #storeAdmin .store-visibility-toggle,
  #storeAdmin .store-featured-toggle{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
  }

  /* Promoción: estado y detalle quedan dentro de su propia celda. */
  #storeAdmin .store-promotion-cell-v4522{
    justify-content:center!important;
    gap:7px!important;
  }
  #storeAdmin .store-promotion-button-v4522{
    flex:0 1 auto!important;
    width:100%!important;
    max-width:150px!important;
    min-width:0!important;
    min-height:36px!important;
    padding:7px 8px!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    place-items:center!important;
    gap:1px!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-align:center!important;
    line-height:1.15!important;
  }
  #storeAdmin .store-promotion-button-v4522 strong,
  #storeAdmin .store-promotion-button-v4522 small{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
  }
  #storeAdmin .store-promotion-button-v4522 strong{
    font-size:.66rem!important;
    letter-spacing:.02em!important;
  }
  #storeAdmin .store-promotion-button-v4522 small{
    font-size:.60rem!important;
    line-height:1.15!important;
  }
}

/* Header de Gestión: reducción moderada solo en móvil.
   Se mantienen reglas separadas para monogramas legacy y logos comerciales. */
@media(max-width:700px){
  .topbar{
    padding:8px max(10px,env(safe-area-inset-right)) 8px max(10px,env(safe-area-inset-left))!important;
    gap:8px!important;
  }
  .brand-lockup{
    flex:1 1 auto!important;
    min-width:0!important;
    gap:8px!important;
  }
  .brand-lockup>div:last-child{
    min-width:0!important;
    overflow:hidden!important;
  }
  .brand-lockup small{
    max-width:100%!important;
    font-size:9px!important;
    line-height:1.1!important;
    letter-spacing:.12em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .brand-lockup h1{
    max-width:100%!important;
    margin-top:2px!important;
    font-size:19px!important;
    line-height:1.05!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .topbar-actions{
    flex:0 0 auto!important;
    gap:4px!important;
  }

  html[data-business-theme="legacy_shewants"] #brandLogoDynamicV4530752{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    padding:0!important;
  }
  html[data-business-theme="legacy_shewants"] #brandLogoDynamicV4530752>img,
  html[data-business-theme="legacy_shewants"] #brandLogoDynamicV4530752>canvas{
    max-width:42px!important;
    max-height:42px!important;
  }

  html[data-business-theme="neutral"] #brandLogoDynamicV4530752{
    width:76px!important;
    height:52px!important;
    min-width:76px!important;
    padding:4px!important;
  }
  html[data-business-theme="neutral"] #brandLogoDynamicV4530752>canvas.header-logo-fitted-v453075213{
    max-width:66px!important;
    max-height:42px!important;
  }
}

@media(max-width:390px){
  #storeAdmin .store-product-admin-row{
    padding-left:10px!important;
    padding-right:10px!important;
  }
  #storeAdmin .store-product-admin-image{
    flex-basis:44px!important;
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
  }
  #storeAdmin .store-product-control-cell{
    min-height:66px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  .brand-lockup h1{font-size:18px!important}
  html[data-business-theme="neutral"] #brandLogoDynamicV4530752{
    width:68px!important;
    height:48px!important;
    min-width:68px!important;
  }
}

/* =========================================================
   v4.5.3.11.6.1 · Correcciones visuales detectadas en QA real
   - Vista previa del logo sin fondo de marca forzado.
   - Selector "Logo de la tienda" con título estable en desktop.
   - Horarios móviles contenidos: etiquetas arriba, inputs sin desborde.
   ========================================================= */

/* F1 · La miniatura pública no debe pintar un cuadrado coral detrás de logos transparentes. */
#storeAdmin .store-admin-preview-brand>span#storeAdminLogoPreview{
  box-sizing:border-box;
  border:1px solid var(--line)!important;
  background:linear-gradient(135deg,#fff 0%,#eee6e1 100%)!important;
  color:var(--brand-dark)!important;
}
#storeAdmin .store-admin-preview-brand>span#storeAdminLogoPreview img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  padding:3px!important;
  box-sizing:border-box!important;
  object-fit:contain!important;
  object-position:center!important;
}

/* F2 · Fieldset/legend: Safari puede calcular el legend como una columna min-content. */
#storeAdmin .store-logo-source-v4531132{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  min-inline-size:0!important;
  box-sizing:border-box!important;
}
#storeAdmin .store-logo-source-v4531132>legend{
  display:block!important;
  float:none!important;
  grid-column:1/-1!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0 0 8px!important;
  padding:0!important;
  white-space:normal!important;
  line-height:1.25!important;
}
#storeAdmin .store-logo-source-option-v4531132{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* F3 · Horarios: en iOS el control time tiene un ancho intrínseco fuerte.
   Cada mitad reserva su propio ancho y coloca DESDE/HASTA arriba del input. */
@media(max-width:760px){
  #storeAdmin .store-schedule-form-v4524,
  #storeAdmin .store-schedule-days-v4524,
  #storeAdmin .store-schedule-day-v4524{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  #storeAdmin .store-schedule-day-v4524{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:12px!important;
    overflow:hidden!important;
  }
  #storeAdmin .store-schedule-day-v4524>label{
    grid-column:1/-1!important;
    min-width:0!important;
    width:100%!important;
  }
  #storeAdmin .store-schedule-day-v4524>div{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:5px!important;
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    align-items:stretch!important;
  }
  #storeAdmin .store-schedule-day-v4524>div>span{
    display:block!important;
    min-width:0!important;
    width:100%!important;
    font-size:.68rem!important;
    line-height:1.1!important;
  }
  #storeAdmin .store-schedule-day-v4524 input[type="time"]{
    display:block!important;
    inline-size:100%!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-inline-size:0!important;
    margin:0!important;
    padding:10px 8px!important;
    box-sizing:border-box!important;
    font-size:16px!important;
    line-height:1.2!important;
  }
}

@media(max-width:360px){
  #storeAdmin .store-schedule-day-v4524{
    grid-template-columns:minmax(0,1fr)!important;
  }
  #storeAdmin .store-schedule-day-v4524>div{
    grid-column:1!important;
  }
}