/* Approved option A: consistent SKU summary cards, independent expanded details. */
@media screen {
  .stock-full-width .stock-fixed-grid{
    display:block!important;
    column-width:276px!important;
    column-gap:12px!important;
    column-fill:balance;
    width:100%;
  }
  .stock-full-width .stock-fixed-grid .stock-fixed-card{
    display:inline-flex!important;
    flex-direction:column;
    gap:8px;
    box-sizing:border-box;
    vertical-align:top;
    width:100%!important;
    height:332px!important;
    min-height:332px!important;
    max-height:332px!important;
    padding:10px 11px;
    margin:0 0 12px!important;
    overflow:hidden;
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
    page-break-inside:avoid;
    border:1px solid #e2eaf4;
  }
  .stock-full-width .stock-fixed-grid .stock-fixed-card.is-expanded{
    height:auto!important;
    max-height:none!important;
    min-height:332px!important;
    overflow:visible;
    border-color:#9dc6fa;
    box-shadow:0 2px 12px rgba(32,99,196,.10);
  }
  .stock-fixed-head{height:22px;min-height:22px;line-height:22px;max-height:22px}
  .stock-fixed-head>b{font-size:14px;max-width:58%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .stock-fixed-head .pill{font-size:11px;white-space:nowrap;padding:3px 6px;line-height:1.1}
  .stock-fixed-head .stock-pill-out{background:#fce5e5;color:#bf2323}
  .stock-fixed-card .stock-fixed-product{
    min-height:94px!important;
    max-height:94px!important;
    height:94px!important;
    flex:none;
    align-items:flex-start;
    overflow:hidden;
    gap:8px;
  }
  .stock-fixed-card .stock-fixed-product .product-photo{
    width:81px!important;
    height:90px!important;
    max-width:34%;
    flex:none;
    object-fit:contain;
  }
  .stock-fixed-card .stock-fixed-product .product-meta{
    flex:1;min-width:0;
    display:flex;flex-direction:column;align-items:flex-start;
    gap:4px;max-height:94px;overflow:hidden;
  }
  .stock-fixed-card .stock-fixed-product .product-meta strong{
    font-size:14px!important;
    line-height:1.25;
    margin:0;
    max-height:36px;
    overflow:hidden;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow-wrap:anywhere;
    max-width:100%;
  }
  .stock-fixed-location,.stock-fixed-category{
    font-size:12px;
    display:block;
    color:#527097;
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:16px;
  }
  .stock-fixed-barcode{width:100%;height:21px;overflow:hidden}
  .stock-fixed-barcode svg{display:block;width:min(146px,100%);height:19px}
  .stock-fixed-summary{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:stretch;gap:5px;flex:none;min-height:60px;height:60px;
    border-top:1px solid #eaf0f8;border-bottom:1px solid #eaf0f8;
    padding:6px 0;
  }
  .stock-fixed-summary>div{display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center;min-width:0}
  .stock-fixed-summary>div+div{border-left:1px solid #eaf0f8}
  .stock-fixed-summary small{font-size:11px!important;line-height:1.1;color:#68809f;white-space:nowrap}
  .stock-fixed-summary strong{font-size:20px!important;line-height:1.1;color:#233e62}
  .stock-fixed-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:auto;min-height:84px;flex:none}
  .stock-fixed-buttons>button{
    min-width:0;min-height:37px;height:37px;max-height:37px;
    font-size:12px!important;line-height:1.2!important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    padding:6px 4px!important;border-radius:6px;
    border:1px solid #dce8f8;color:#1a5bb6;background:#f9fcff;
  }
  .stock-fixed-buttons>button.stock-expand-btn{background:#e9f3ff;border-color:#b5d4ff;color:#1166d7;font-weight:700}
  .stock-fixed-buttons>button.stock-delete-btn{background:#fff6f7;border-color:#f7d4da;color:#ce4a58}
  .stock-fixed-buttons>button:disabled{opacity:.48;cursor:not-allowed}
  .stock-expanded-details{margin-top:7px;border-top:1px solid #d7e5f7;padding-top:11px;min-width:0}
  .stock-expanded-title{display:flex;gap:8px;align-items:center;justify-content:space-between;color:#173968;font-size:14px;font-weight:700;margin-bottom:8px}
  .stock-expanded-title span{color:#7b92af;font-size:11px;font-weight:400;text-align:right}
  .stock-expanded-table{width:100%;max-width:100%}
  .stock-expanded-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px 35px 36px 28px;
    gap:3px;align-items:center;min-height:38px;
    padding:3px 1px;
    border-bottom:1px solid #edf2f8;
    font-size:12px;
    text-align:center;
  }
  .stock-expanded-row.stock-expanded-heading{
    min-height:28px;background:#f1f7ff;color:#6381aa;font-size:11px;
    padding-inline:4px;
  }
  .stock-expanded-row:last-child{border-bottom:0}
  .stock-expanded-color{
    display:flex;align-items:center;gap:5px;min-width:0;text-align:left;
  }
  .stock-expanded-color img{
    width:29px;height:29px;max-width:29px;max-height:29px;
    display:block;object-fit:contain;background:#f5f8fc;
    border:1px solid #e9edf4;border-radius:5px;flex:none;
  }
  .stock-expanded-color>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .stock-expanded-row .stock-row-edit{padding:3px 4px;min-height:27px;height:27px}
  .stock-expanded-empty{font-size:12px;color:#8598ae;text-align:center;padding:12px 0}
  .stock-fixed-toolbar{min-width:0}
  .stock-fixed-toolbar .right{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
  .stock-fixed-toolbar .right button{font-size:12px;white-space:nowrap}
}
@media screen and (max-width:1200px){
 .stock-full-width .stock-fixed-grid{column-width:270px!important}
 .stock-fixed-toolbar .right{justify-content:flex-end}
}
@media screen and (max-width:700px){
 .stock-full-width .stock-fixed-grid{column-width:auto!important;column-count:1!important}
 .stock-full-width .stock-fixed-grid .stock-fixed-card{max-width:none;width:100%!important}
 .stock-fixed-toolbar .right{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
 .stock-fixed-toolbar .right button{min-width:0;white-space:normal;min-height:41px;line-height:1.1;font-size:12px}
 .stock-fixed-summary small{font-size:12px!important}
 .stock-expanded-row{grid-template-columns:minmax(0,1fr) 45px 40px 40px 32px}
}

/* 2026-10-22: compact SKU card per annotated mockup. */
@media screen {
  .stock-fixed-card .stock-fixed-head{display:flex;align-items:center;gap:5px;justify-content:initial}
  .stock-fixed-card .stock-fixed-head>b{flex:0 1 auto;max-width:39%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
  .stock-fixed-card .stock-head-category{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;color:#205eb3;font-size:12px;font-weight:650;line-height:1.3}
  .stock-fixed-card .stock-fixed-head>.pill{flex:0 0 auto;margin-left:auto}
  .stock-fixed-card .stock-fixed-product .product-meta{gap:4px;max-height:94px;justify-content:flex-start}
  .stock-fixed-card .stock-fixed-product .product-meta strong{
    font-size:23.8px!important; /* 28px reduced by 15% */
    line-height:1.04!important;
    max-height:62px!important;
    min-height:0;
    margin:0!important;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow-wrap:anywhere;
  }
  .stock-fixed-card .stock-fixed-product .stock-fixed-barcode{margin-top:auto;flex:none;height:21px;max-height:21px}
}
@media screen and (max-width:700px){
  .stock-fixed-card .stock-fixed-product .product-meta strong{font-size:22.95px!important}
  .stock-fixed-card .stock-head-category{font-size:12px}
}


/* Final approved: 20% wider SKU tiles, near-square, larger main image, centered title.
   Scope is stock management cards only; warehouse data and shipping print layout unchanged. */
@media screen {
  .stock-full-width .stock-fixed-grid {
    column-width:332px!important; /* previous 276px * 1.20 */
    column-gap:13px!important;
    column-count:auto!important;
  }
  .stock-full-width .stock-fixed-grid .stock-fixed-card{
    width:100%!important;
    height:360px!important;
    min-height:360px!important;
    max-height:360px!important;
    gap:8px;
    padding:12px 12px;
    overflow:hidden;
    border-radius:11px;
  }
  .stock-full-width .stock-fixed-grid .stock-fixed-card.is-expanded{
    height:auto!important;
    max-height:none!important;
    min-height:360px!important;
    overflow:visible;
  }
  .stock-fixed-card .stock-fixed-head{
    height:24px!important;
    min-height:24px!important;
    max-height:24px!important;
  }
  .stock-fixed-card .stock-fixed-product{
    flex:none;
    width:100%;
    height:137px!important;
    min-height:137px!important;
    max-height:137px!important;
    display:flex;
    align-items:center!important;
    gap:11px!important;
    overflow:hidden;
  }
  .stock-fixed-card .stock-fixed-product .product-photo{
    width:105px!important;   /* 81 * 1.30 */
    height:117px!important;  /* 90 * 1.30 */
    min-width:105px!important;
    max-width:37%!important;
    flex:0 0 105px;
    display:block;
    object-fit:contain;
    border-radius:8px;
    align-self:center;
  }
  .stock-fixed-card .stock-fixed-product .product-meta{
    flex:1 1 0;
    min-width:0;
    width:auto;
    height:100%;
    min-height:0;
    max-height:none!important;
    display:flex!important;
    flex-direction:column;
    justify-content:center!important;
    align-items:center!important;
    text-align:center!important;
    gap:0;
    overflow:hidden;
  }
  .stock-fixed-card .stock-fixed-product .product-meta strong{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    line-clamp:3;
    max-height:88px!important;
    max-width:100%;
    margin:0!important;
    font-size:23.8px!important; /* unchanged after preceding 15% reduction */
    line-height:1.15!important;
    text-align:center!important;
    overflow:hidden;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  .stock-fixed-card .stock-fixed-summary{
    flex:0 0 52px;
    height:52px!important;
    min-height:52px!important;
    padding:2px 0!important;
    gap:0!important;
    margin:0!important;
  }
  .stock-fixed-card .stock-fixed-summary>div{gap:1px!important}
  .stock-fixed-card .stock-fixed-summary small{font-size:11px!important;line-height:1.15!important}
  .stock-fixed-card .stock-fixed-summary strong{font-size:20px!important;line-height:1.1!important}
  .stock-fixed-card .stock-fixed-buttons{
    flex:0 0 84px;
    min-height:84px!important;
    margin-top:auto!important;
    gap:6px;
  }
}
@media screen and (max-width:1200px){
  .stock-full-width .stock-fixed-grid{column-width:315px!important}
}
@media screen and (max-width:700px){
  .stock-full-width .stock-fixed-grid{column-width:auto!important;column-count:1!important}
  .stock-full-width .stock-fixed-grid .stock-fixed-card{
    width:100%!important;
    height:360px!important;
    min-height:360px!important;
  }
  .stock-full-width .stock-fixed-grid .stock-fixed-card.is-expanded{
    height:auto!important;
    min-height:360px!important;
  }
  .stock-fixed-card .stock-fixed-product .product-meta strong{font-size:22.95px!important}
}
@media screen and (max-width:365px){
  .stock-fixed-card .stock-fixed-product .product-photo{
    width:93px!important;
    min-width:93px!important;
    flex-basis:93px;
    height:105px!important;
  }
  .stock-fixed-card .stock-fixed-product .product-meta strong{font-size:21px!important}
}

/* Stock card enlarged photo preview; overlay doesn't consume SKU grid space. */
.stock-full-width .stock-fixed-card [data-stock-photo-preview]{
  cursor:zoom-in;
}
.stock-hover-image-preview{
  position:fixed!important;
  z-index:5000!important;
  width:min(400px,calc(100vw - 24px));
  max-height:calc(100dvh - 24px);
  box-sizing:border-box;
  padding:11px;
  border-radius:12px;
  border:1px solid #dbe5f2;
  background:white;
  box-shadow:0 12px 35px rgba(21,45,82,.25);
  pointer-events:none!important;
  overflow:hidden;
}
.stock-hover-image-preview[hidden]{display:none!important}
.stock-hover-image-large{
  display:block;
  width:100%;
  max-height:min(400px,calc(100dvh - 91px));
  object-fit:contain;
  border-radius:8px;
  background:#f7f9fd;
}
.stock-hover-image-caption{
  margin-top:7px;
  font-size:14px;
  color:#20375b;
  font-weight:650;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:center;
}
@media (hover:none), (pointer:coarse){
  .stock-full-width .stock-fixed-card [data-stock-photo-preview]{cursor:default}
  .stock-hover-image-preview{display:none!important}
}



/* Unified product + color editor: four actions in two rows. */
.stock-fixed-card .stock-fixed-buttons{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.stock-fixed-card .stock-fixed-buttons>button{grid-column:auto!important}
.stock-fixed-card .stock-fixed-buttons>.stock-edit-btn{background:#eaf4ff;border-color:#b8d7ff;color:#135cb9;font-weight:700}
.stock-color-modal .stock-unified-product-fields{border:1px solid #dce8f8;border-radius:9px;background:#f8fbff;padding:12px;margin:10px 0}
.stock-color-modal .stock-unified-product-fields h3{margin:0 0 9px;color:#1a3d70;font-size:15px}
.stock-color-modal .stock-unified-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.stock-color-modal .stock-unified-fields-grid label{font-size:12px;color:#38547b;display:flex;flex-direction:column;gap:5px;min-width:0}
.stock-color-modal .stock-unified-fields-grid input,.stock-color-modal .stock-unified-fields-grid select{box-sizing:border-box;width:100%;min-width:0;padding:9px 8px;font:inherit;border-radius:6px;border:1px solid #ccdaf0;background:white;color:#20375e}
.stock-color-modal .stock-unified-tip{font-size:11px;color:#6b7f99;margin:8px 0 0}
@media(max-width:680px){.stock-color-modal .stock-unified-fields-grid{grid-template-columns:1fr}}