#editModal {box-sizing:border-box;padding:16px;overflow:hidden;}
#editModal > .modal-box.product-modal.with-close {width:850px;max-width:calc(100vw - 32px);min-width:0;max-height:calc(100dvh - 32px);box-sizing:border-box;margin:auto;overflow-y:auto;overflow-x:hidden;}
#editModal .form-grid,#editModal .form-field {min-width:0;}
#editModal #eSku,#editModal #ePrice {font-weight:700;}
#editModal .product-core-fields-row > .form-field:has(#ePrice) {order:-1;}
#editModal .edit-variant-entry-row:not(.single-mode) {grid-template-columns:minmax(0,1fr) 76px 76px 96px;}
#editModal #eVariantAddButton {width:96px;background:#222;color:#fff;border-color:#222;white-space:nowrap;}
#editModal #eVariantAddButton:hover {background:#333;}
#editModal #eVariantAddButton:disabled {opacity:.6;cursor:wait;}
#editModal .edit-stock-summary {display:flex;align-items:center;gap:6px;box-sizing:border-box;height:42px;padding:0 12px;border:1.5px solid #d8d8d8;border-radius:8px;background:#f3f3f3;}
#editModal .edit-stock-summary #eStock {flex:1 1 40px;min-width:0;width:40px;height:38px;padding:0;border:0;background:transparent;text-align:left;box-shadow:none;appearance:textfield;}
#editModal .edit-stock-summary #eStock::-webkit-inner-spin-button {appearance:none;}
#editModal #eStockHint {color:#777;font-size:11px;font-weight:700;line-height:1.3;}
@media(max-width:620px) {
 #editModal .edit-variant-entry-row:not(.single-mode) {grid-template-columns:minmax(0,1fr) minmax(0,1fr) 96px;}
 #editModal .edit-variant-entry-row .variant-entry-name-field {grid-column:1 / -1;}
}
#editModal #eVariantList {width:100%;max-width:100%;min-width:0;overflow:auto;scrollbar-width:none;border:1px solid #222;border-radius:8px;padding-bottom:0;box-sizing:border-box;cursor:grab;}
#editModal #eVariantList::-webkit-scrollbar {display:none;}
#editModal #eVariantList.is-dragging {cursor:grabbing;user-select:none;}
#editModal #eVariantList::-webkit-scrollbar-track {background:transparent;}
#editModal #eVariantList::-webkit-scrollbar-thumb {background:#aaa;border-radius:4px;}
#editModal #eVariantList::-webkit-scrollbar-thumb:hover {background:#888;}
#editModal #eVariantList::-webkit-scrollbar-button {display:none;}
#editModal .edit-variant-matrix {width:100%;min-width:0;table-layout:fixed;border-collapse:separate;border-spacing:0;border:0;font-size:11px;}
#editModal .edit-variant-matrix th,#editModal .edit-variant-matrix td {box-sizing:border-box;height:47px;padding:4px 6px;border-right:1px solid #222;border-bottom:1px solid #222;text-align:center;background:#fff;overflow-wrap:anywhere;font-size:11px;font-weight:500;line-height:1.3;}
#editModal .edit-variant-matrix thead th {height:47px;}
#editModal #eVariantList .edit-variant-matrix thead tr:last-child>th {border-bottom:1px solid #222;}
#editModal .edit-variant-matrix th:first-child {position:sticky;left:0;z-index:2;width:100px;background:#f7f7f7;}
#editModal .edit-variant-matrix tbody tr {--layer-background:#fff;}
#editModal .edit-variant-matrix tbody tr:nth-child(2) {--layer-background:#f7f7f7;}
#editModal .edit-variant-matrix tbody tr:nth-child(3) {--layer-background:#efefef;}
#editModal .edit-variant-matrix tbody tr:nth-child(4) {--layer-background:#e7e7e7;}
#editModal .edit-variant-matrix tbody tr:nth-child(n+5) {--layer-background:#dfdfdf;}
#editModal .edit-variant-matrix tbody tr>th:first-child,
#editModal .edit-variant-matrix tbody tr>td {background:var(--layer-background);}
#editModal .edit-variant-matrix tbody tr:last-child>* {border-bottom:0;}
#editModal .edit-variant-matrix tr>*:last-child {border-right:0;}
#editModal .edit-variant-matrix input {box-sizing:border-box;width:100%;min-width:0;height:36px;border:1px solid #ddd;border-radius:4px;padding:0 7px;font:inherit;background:#fff;appearance:textfield;}
#editModal .edit-variant-matrix input::-webkit-inner-spin-button {appearance:none;}
#editModal .edit-variant-matrix .edit-variant-name-wrap {display:grid;grid-template-columns:minmax(0,1fr) 24px 24px;align-items:center;gap:2px;min-width:0;}
#editModal .edit-variant-matrix .edit-variant-name {padding:0 5px;font-weight:700;border:0;border-bottom:1px solid transparent;border-radius:0;background:transparent;outline:none;box-shadow:none;}
#editModal .edit-variant-matrix .edit-variant-name:focus {border-bottom-color:#222;box-shadow:none;}
#editModal .edit-variant-matrix .edit-variant-copy,
#editModal .edit-variant-matrix .edit-variant-delete {position:static;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border:0;border-radius:0;background:transparent;width:24px;height:24px;padding:4px;cursor:pointer;}
#editModal .edit-variant-matrix .edit-variant-delete svg {width:14px;height:14px;flex:0 0 14px;}
#editModal .edit-matrix-actions {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;gap:4px;}
#editModal .edit-matrix-actions button {height:34px;border:1px solid #ddd;border-radius:4px;background:#fff;padding:0 5px;white-space:nowrap;}
#editModal .edit-matrix-actions .edit-variant-photo-thumb {width:34px!important;height:34px!important;min-width:34px;flex:0 0 34px;box-sizing:border-box;overflow:hidden;}
#editModal .edit-matrix-actions img {width:100%;height:100%;object-fit:cover;}
#editModal .edit-matrix-spec {display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:4px;padding-inline:4px;}
#editModal .edit-matrix-spec .edit-variant-photo-thumb {display:flex;align-items:center;justify-content:center;color:#333333!important;}
#editVariantPhotoDialog {position:fixed;inset:0;margin:auto;box-sizing:border-box;width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:16px;border:1px solid #222;border-radius:8px;overflow:auto;font:inherit;}
#editVariantPhotoDialog[open] {display:flex;flex-direction:column;gap:12px;}
#editVariantPhotoDialog::backdrop {background:rgb(0 0 0 / 55%);}
#editVariantPhotoDialog header {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
#editVariantPhotoDialog strong {overflow-wrap:anywhere;}
#editVariantPhotoDialog img {display:block;align-self:center;max-width:100%;width:auto;height:auto;max-height:calc(100dvh - 190px);min-height:0;object-fit:contain;}
#editVariantPhotoDialog footer {display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:0;flex-shrink:0;}
#editVariantPhotoDialog [role="status"] {margin:0;color:#a32121;font-size:12px;}
#editVariantPhotoDialog [role="status"]:empty {display:none;}
#editVariantPhotoDialog button {display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:6px 12px;border:1px solid #222;border-radius:6px;background:#fff;color:#111;font:inherit;cursor:pointer;}
#editModal .edit-matrix-spec .edit-variant-photo-thumb {width:34px!important;height:34px!important;min-width:0;overflow:hidden;}
#editModal .edit-matrix-spec img {width:100%;height:100%;object-fit:cover;}
#editModal .edit-matrix-camera {height:34px;min-width:0;border:1px solid #ddd;border-radius:4px;background:#fff;padding:0;font:inherit;}
@media(max-width:620px) {#editModal .edit-matrix-spec {grid-template-columns:minmax(0,1fr);justify-items:stretch;}#editModal .edit-matrix-spec .edit-variant-photo-thumb {justify-self:center;}}
#editModal .edit-matrix-layer-inline {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:6px;}
#editModal .edit-matrix-layer-inline strong {font-size:11px;font-weight:700;white-space:nowrap;}
#editModal .edit-matrix-layer-inline>span {font-size:11px;white-space:normal;}
#editModal .edit-matrix-layer-inline small {font-size:9px;}
#editModal .edit-matrix-layer-inline .edit-matrix-static-field {display:flex;align-items:baseline;justify-content:center;gap:4px;min-width:0;white-space:nowrap;font-weight:400;}
#editModal .edit-matrix-static-value {box-sizing:border-box;width:48px;max-width:calc(100% - 26px);min-width:0;height:22px;line-height:20px;padding:0 2px;border-bottom:1px solid transparent;text-align:center;font-weight:700;}
#editModal .edit-matrix-entry td {white-space:nowrap;}
#editModal .edit-matrix-entry label {display:inline-flex;align-items:baseline;justify-content:center;width:calc(50% - 3px);gap:4px;vertical-align:middle;margin:0;font-size:11px;font-weight:400;white-space:nowrap;}
#editModal .edit-matrix-entry label+label {margin-left:6px;}
#editModal .edit-matrix-entry label input {width:48px;max-width:calc(100% - 26px);height:22px;line-height:20px;border:0;border-bottom:1px solid transparent;border-radius:0;background:transparent;padding:0 2px;text-align:center;outline:none;box-shadow:none;}
#editModal .edit-matrix-entry label input:placeholder-shown,
#editModal .edit-matrix-entry label input:focus {border-bottom-color:#222;box-shadow:none;}
#editModal .edit-matrix-entry .edit-variant-stock-in {font-weight:700;color:#222;}
#editModal .edit-matrix-entry .edit-variant-stock-in::placeholder {font-weight:400;color:#777;}
#editModal .edit-matrix-entry label input {font-size:11px;font-weight:700;}
#editModal .edit-matrix-money {display:inline-grid;grid-template-columns:minmax(0,1fr) 22px;align-items:baseline;width:48px;max-width:calc(100% - 26px);height:22px;min-width:0;font-weight:700;}
#editModal .edit-matrix-money small {font-size:9px;line-height:20px;font-weight:700;text-align:left;}
#editModal .edit-matrix-money .edit-matrix-static-value,
#editModal .edit-matrix-entry .edit-matrix-money input {box-sizing:border-box;width:100%;max-width:none;min-width:0;height:22px;line-height:20px;padding:0;border-bottom:1px solid transparent;font-size:11px;font-weight:700;text-align:center;}
#editModal .edit-matrix-entry .edit-matrix-money input:focus,
#editModal .edit-matrix-entry .edit-matrix-money input:placeholder-shown {border-bottom-color:#222;}
#editModal .edit-matrix-money:has(input:placeholder-shown) {grid-template-columns:minmax(0,1fr);}
#editModal .edit-matrix-money:has(input:placeholder-shown) small {display:none;}
#editModal .edit-matrix-entry .edit-matrix-money:has(input:placeholder-shown) input {width:100%;}
#editModal .edit-variant-matrix .edit-layer-pending {color:#777;}
#editModal .edit-variant-matrix .edit-layer-complete {color:#111;}
#editModal .edit-matrix-entry .edit-layer-pending input,
#editModal .edit-matrix-entry .edit-layer-complete input,
#editModal .edit-matrix-entry label {color:inherit;}
#editModal .edit-layer-unavailable {display:inline-block;width:20px;height:1px;background:#999;font-size:0;vertical-align:middle;}
#editModal .layer-autosave-status {display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:20px;padding:2px 8px;font-size:11px;color:#666;}
#editModal .layer-autosave-status button {border:0;background:transparent;color:#222;text-decoration:underline;font:inherit;cursor:pointer;}
#editModal #editLayerSaveStatus:empty,
#editModal #editLayerSaveStatus:has(.layer-autosave-status > span:empty:only-child) {display:none;}
#editModal .edit-matrix-field-icon {display:inline-flex;align-items:baseline;justify-content:center;gap:3px;flex:0 0 auto;white-space:nowrap;}
#editModal .edit-matrix-field-icon svg {position:relative;top:2px;width:13px;height:13px;flex:0 0 13px;}
#editModal .edit-matrix-field-icon .edit-matrix-sr-only {position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:nowrap;}
@media(any-pointer:coarse) {
 /* Keep the editable text large enough before focus on touch browsers. */
 #editModal .edit-variant-matrix input {font-size:16px!important;}
 #editModal .edit-matrix-money {width:82px;column-gap:6px;grid-template-columns:minmax(0,1fr) 27px;}
 #editModal .edit-matrix-money small {font-size:12px;}
 #editModal .edit-matrix-entry label {font-size:13px;}
 #editModal .edit-variant-matrix .edit-variant-name-wrap {grid-template-columns:minmax(0,1fr) 36px 36px;}
 #editModal .edit-variant-matrix .edit-variant-copy,
 #editModal .edit-variant-matrix .edit-variant-delete {width:36px;height:36px;padding:7px;}
 #editModal .edit-variant-matrix .edit-variant-copy svg {width:22px;height:22px;flex:0 0 22px;}
 #editModal .edit-variant-matrix .edit-variant-delete svg {width:20px;height:20px;flex:0 0 20px;}
}
@media(any-pointer:coarse) and (max-width:620px) {
 #editModal .edit-matrix-entry label input,
 #editModal .edit-matrix-entry .edit-matrix-money input,
 #editModal .edit-matrix-money {height:20px;line-height:20px;}
}
@media(min-width:621px) {
 #editModal .edit-matrix-layer-inline {padding-inline:4px;}
 #editModal .edit-matrix-layer-inline .edit-matrix-static-field:first-child {justify-content:flex-start;}
 #editModal .edit-matrix-layer-inline .edit-matrix-static-field:last-child {justify-content:flex-end;}
 #editModal .edit-matrix-entry label:first-child {justify-content:flex-start;padding-left:4px;box-sizing:border-box;}
 #editModal .edit-matrix-entry label+label {justify-content:flex-end;padding-right:4px;box-sizing:border-box;}
}
@media(max-width:620px) {
 #editModal .edit-matrix-layer-inline {grid-template-columns:minmax(0,1fr);gap:2px;}
 #editModal .edit-matrix-entry label {display:flex;width:100%;}
 #editModal .edit-matrix-entry label+label {margin-left:0;}
 #editModal .edit-matrix-money {grid-template-columns:minmax(0,1fr) minmax(0,22px);}
 #editModal .edit-matrix-money small {min-width:0;overflow:hidden;}
 #editModal .edit-variant-matrix th,#editModal .edit-variant-matrix td {padding:3px;}
 #editModal .edit-matrix-entry label {grid-template-columns:minmax(0,1fr);font-size:11px;}
 #editModal .edit-variant-matrix .edit-variant-name {padding:0 3px;}
 #editModal .edit-variant-matrix .edit-variant-name-wrap {grid-template-columns:repeat(2,minmax(0,1fr));}
 #editModal #eVariantList .edit-variant-matrix .edit-variant-name-wrap {height:auto;}
 #editModal .edit-variant-matrix .edit-variant-name {grid-column:1 / -1;}
 #editModal .edit-variant-matrix .edit-variant-copy,#editModal .edit-variant-matrix .edit-variant-delete {margin:auto;}
}
@media(any-pointer:coarse) and (max-width:620px) {
 #editModal .edit-matrix-money {grid-template-columns:minmax(0,1fr) 27px;}
}