/* Labelay product-page layout polish.
 * Keeps the desktop order summary sticky without creating an internal scroll area,
 * and gives the artwork-by-design controls a balanced visual structure.
 */

@media (min-width:1181px){
  #product .labelay-pdp__summary-wrap{
    position:sticky!important;
    top:112px!important;
    align-self:start!important;
    z-index:12;
  }

  #product .labelay-pdp__summary{
    position:relative!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    scrollbar-width:auto!important;
  }

  #product .labelay-pdp__summary::-webkit-scrollbar{
    display:none!important;
  }
}

/* Artwork source and quantity are separate concepts: file/Canva are paired,
 * while quantity gets its own full-width row. */
.labelay-builder .labelay-design-row{
  padding:12px!important;
  border-color:#ded8d2!important;
  border-radius:12px!important;
  background:#fbfaf8!important;
}

.labelay-builder .labelay-design-row__top{
  margin-bottom:10px!important;
  padding-bottom:8px;
  border-bottom:1px solid #eee8e2;
}

.labelay-builder .labelay-design-row__top>strong{
  font-size:9.5px!important;
  color:#292623;
}

.labelay-builder .labelay-design-row__body{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr)!important;
  grid-template-areas:
    "artwork or canva"
    "quantity quantity quantity"!important;
  gap:10px 8px!important;
  align-items:stretch!important;
}

.labelay-builder .labelay-design-row__artwork{
  grid-area:artwork!important;
  display:flex!important;
  flex-direction:column;
  min-width:0;
  padding:10px;
  border:1px solid #e5dfd8;
  border-radius:10px;
  background:#fff;
}

.labelay-builder .labelay-design-row__canva{
  grid-area:canva!important;
  display:flex!important;
  flex-direction:column;
  min-width:0;
  margin:0!important;
  padding:10px;
  border:1px solid #e5dfd8;
  border-radius:10px;
  background:#fff;
}

.labelay-builder .labelay-design-row__or{
  grid-area:or!important;
  align-self:center!important;
  justify-self:center;
  display:grid!important;
  place-items:center;
  width:26px;
  height:26px;
  border:1px solid #e4ddd6;
  border-radius:50%;
  background:#f7f4f1;
  color:#958d86!important;
  font-size:6.5px!important;
  font-weight:900!important;
  line-height:1;
}

.labelay-builder .labelay-design-row__label,
.labelay-builder .labelay-design-row label>span{
  margin-bottom:6px!important;
  color:#4a4541!important;
  font-size:8px!important;
  font-weight:850!important;
}

.labelay-builder .labelay-upload-control{
  display:flex!important;
  flex:1 1 auto;
  flex-direction:column;
  justify-content:center;
  min-height:88px;
  margin:0!important;
  padding:10px!important;
  border:1px dashed #cfc5bc!important;
  border-radius:9px!important;
  background:#fdfcfb!important;
}

.labelay-builder .labelay-upload-control:hover{
  border-color:#f0a26f!important;
  background:#fff9f5!important;
}

.labelay-builder .labelay-file-preview{
  min-height:48px!important;
}

.labelay-builder .labelay-design-row__canva input{
  min-height:42px!important;
  margin-top:auto;
  border-color:#d8d1ca!important;
  border-radius:8px!important;
  background:#fdfdfc!important;
}

.labelay-builder .labelay-design-row__canva small{
  margin-top:6px!important;
}

.labelay-builder .labelay-design-row__quantity{
  grid-area:quantity!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 120px;
  align-items:center;
  gap:12px;
  margin:0!important;
  padding:9px 10px;
  border:1px solid #e6dfd8;
  border-radius:9px;
  background:#f7f5f2;
}

.labelay-builder .labelay-design-row__quantity>span{
  margin:0!important;
  color:#5b544e!important;
  font-size:8px!important;
}

.labelay-builder .labelay-design-row__quantity input{
  min-height:38px!important;
  padding:6px 8px!important;
  border-color:#d5cdc5!important;
  background:#fff!important;
  font-weight:850;
  text-align:center;
}

.labelay-builder .labelay-designs__footer{
  margin-top:10px!important;
  padding-top:2px;
}

.labelay-builder .labelay-add-design{
  min-height:34px!important;
  padding:0 12px!important;
  border-radius:8px!important;
  background:#fff!important;
}

@media (max-width:767px){
  .labelay-builder .labelay-design-row__body{
    grid-template-columns:1fr!important;
    grid-template-areas:
      "artwork"
      "or"
      "canva"
      "quantity"!important;
  }

  .labelay-builder .labelay-design-row__or{
    width:auto;
    height:auto;
    padding:2px 8px;
    border:0;
    border-radius:999px;
    background:transparent;
  }

  .labelay-builder .labelay-design-row__quantity{
    grid-template-columns:minmax(0,1fr) 110px;
  }
}

@media (max-width:480px){
  .labelay-builder .labelay-design-row__quantity{
    grid-template-columns:1fr;
    gap:6px;
  }

  .labelay-builder .labelay-design-row__quantity input{
    text-align:left;
  }
}