/* Clean product detail layout */
.product-main {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
    min-height: 0;
    height: 100%;
    padding: 20px;
    overflow-y: auto;
    overflow-x: hidden;
    background: #f5f6f8;
    color: #18202b;
}

.product-title-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    flex: 0 0 auto;
}

.product-title-row > div:first-child { min-width: 0; }
.product-path {
    display: flex;
    gap: 7px;
    margin-bottom: 6px;
    color: #718096;
    font-size: 11px;
}
.product-path a { color: #846de7; text-decoration: none; }
.product-title-row h2 {
    max-width: 100%;
    color: #18202b;
    font-size: 28px;
    line-height: 1.15;
    overflow-wrap: anywhere;
}
.product-title-row h2.copy-field:hover,
.product-title-row h2.copy-field:active { color: #846de7 !important; }
.product-nav-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.product-nav-button,
.product-title-row .inventory-action {
    padding: 8px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 5px;
    background: #fff;
    color: #334155;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
}
.product-nav-button:hover,
.product-nav-button:focus-visible,
.product-nav-button:active {
    background: #846de7 !important;
    border-color: #846de7 !important;
    color: #fff !important;
}
.delete-product-button {
    padding: 8px 11px;
    border: 1px solid #ef3b3a;
    border-radius: 5px;
    background: #ef3b3a;
    color: #fff;
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
}
.delete-product-button:hover,
.delete-product-button:focus-visible,
.delete-product-button:active { background: #ef3b3a !important; border-color: #ef3b3a !important; color: #fff !important; }
.product-title-row .inventory-action { background: #1f2937; border-color: #1f2937; color: #fff; }
.product-title-row .inventory-action:hover,
.product-title-row .inventory-action:focus-visible,
.product-title-row .inventory-action:active { background: #846de7 !important; border-color: #846de7 !important; color: #fff !important; }
.product-title-row .inventory-action:disabled { opacity: .6; cursor: default; }

.images-section,
.product-data-box,
.links-section,
.notes-block {
    box-sizing: border-box;
    width: 100%;
    flex: 0 0 auto;
    padding: 18px;
    border: 1px solid #e1e6ed;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}
.images-section {
    display: grid;
    grid-template-columns: minmax(190px, 250px) minmax(0, 1fr) minmax(220px, 280px);
    gap: 24px;
    align-items: start;
}
.image-gallery { display: flex; justify-content: center; min-width: 0; }
.main-image {
    width: min(100%, 230px);
    height: 230px;
    object-fit: contain;
    border: 1px solid #e1e6ed;
    border-radius: 6px;
    background: #f8fafc;
}
.image-thumbs { display: none; }
.basic-info-box {
    display: grid;
    gap: 0;
    min-width: 0;
}

.basic-info-box > .field-row {
    min-height: 24px;
    margin: 0;
    padding: 0;
    align-items: center;
}
.price-chart {
    min-width: 0;
    padding: 14px;
    border: 1px solid #e1e6ed;
    border-radius: 6px;
    background: #f8fafc;
}
.price-chart h3 {
    margin: 0 0 14px;
    color: #334155;
    font-size: 13px;
    text-transform: uppercase;
}
.price-chart-row {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: #647184;
    font-size: 10px;
}
.price-chart-row:last-child { margin-bottom: 0; }
.price-chart-row strong { color: #18202b; font-size: 11px; }
.price-chart-track { height: 7px; overflow: hidden; border-radius: 99px; background: #e1e6ed; }
.price-chart-track span { display: block; height: 100%; border-radius: inherit; background: #846de7; }
.inline-dimensions {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    border-top: 0;
}
.inline-dimensions h3 {
    display: flex;
    align-items: center;
    min-height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    color: #334155;
    font-size: 12px;
    text-transform: uppercase;
}
.inline-dimensions .field-row {
    min-height: 24px;
    margin: 0;
    padding: 0;
    align-items: center;
}
.inline-dimensions .field-row:last-child { margin-bottom: 0; }

.links-section {
    margin-top: 12px;
    clear: both;
}
.field-row {
    display: grid;
    grid-template-columns: minmax(105px, 145px) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    min-width: 0;
    margin: 0 0 8px;
    padding: 0 0 8px;
    border-bottom: 1px solid #edf0f4;
    color: #18202b;
    font-size: 12px;
    line-height: 1.35;
}
.images-section .field-row { border-bottom: 0; margin-bottom: 5px; padding-bottom: 0; }
.field-row label { color: #647184; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.field-row span,
.field-row code { min-width: 0; overflow-wrap: anywhere; color: #18202b; }
.copy-field { cursor: pointer; border-radius: 3px; }
.copy-field:hover { color: #846de7; }
.source-empty,
.field-row.is-empty { display: none !important; }
.duplicate-ean-row,
.is-empty-section { display: none; }

.more-info-heading {
    flex: 0 0 auto;
    margin: 2px 2px -4px;
    color: #334155;
    font-size: 13px;
    letter-spacing: .6px;
    text-transform: uppercase;
}
.product-data-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 22px;
}
.product-data-box .sections-grid,
.product-data-box .details-grid { display: contents; }
.product-data-box > .sections-grid > .product-section,
.product-data-box > .details-grid > .product-section {
    min-width: 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.product-data-box h3,
.links-section h3 {
    margin: 0 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e9ef;
    color: #334155;
    font-size: 13px;
    text-transform: uppercase;
}
.product-data-box > .sections-grid > .product-section:nth-child(1) { grid-column: 1; }
.product-data-box > .sections-grid > .product-section:nth-child(2) { grid-column: 1; }
.product-data-box > .details-grid > .product-section:nth-child(1) { grid-column: 2; }
.product-data-box > .details-grid > .product-section:nth-child(2) { grid-column: 2; }
.product-data-box > .details-grid > .product-section:nth-child(3) { grid-column: 2; }

.product-data-box {
    align-items: start;
    grid-auto-flow: row;
}

.product-data-box {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-data-box > .sections-grid > .product-section:nth-child(1) { grid-column: 1; }
.product-data-box > .sections-grid > .product-section:nth-child(2) { grid-column: 3; }
.product-data-box > .details-grid > .product-section:nth-child(1) { grid-column: 3; }
.product-data-box > .details-grid > .product-section:nth-child(2) { grid-column: 3; }
.product-data-box > .details-grid > .product-section:nth-child(3) { grid-column: 2; }

.product-data-box > .sections-grid > .product-section,
.product-data-box > .details-grid > .product-section {
    width: 100%;
}

.product-data-box .field-row:last-child {
    margin-bottom: 0;
}

.links-section { display: block; }
.links-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.link-item { display: grid; gap: 6px; min-width: 0; }
.link-item label { color: #647184; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.link-btn { padding: 8px; border: 1px solid #d7dee8; border-radius: 5px; color: #334155; text-align: center; text-decoration: none; font-size: 11px; }
.link-btn:hover { border-color: #846de7; color: #846de7; }
.notes-block { display: block; }
.notes-block h4 { margin: 0 0 8px; color: #334155; font-size: 13px; text-transform: uppercase; }
.notes-field { width: 100%; min-height: 48px; resize: vertical; border: 1px solid #d7dee8; border-radius: 5px; padding: 9px; color: #18202b; background: #f8fafc; }
.store-manager-section,
.retailers-section { display: none; }

html:not(.light-mode) .product-main { background: #131722; color: #f3f4f6; }
html:not(.light-mode) .images-section,
html:not(.light-mode) .product-data-box,
html:not(.light-mode) .links-section,
html:not(.light-mode) .notes-block { background: #0f0f0f; border-color: #242936; }
html:not(.light-mode) .product-title-row h2,
html:not(.light-mode) .field-row span,
html:not(.light-mode) .field-row code,
html:not(.light-mode) .product-data-box h3,
html:not(.light-mode) .links-section h3,
html:not(.light-mode) .notes-block h4 { color: #f3f4f6; }
html:not(.light-mode) .field-row { border-color: #242936; }
html:not(.light-mode) .field-row label,
html:not(.light-mode) .product-eyebrow,
html:not(.light-mode) .link-item label { color: #9ca3af; }
html:not(.light-mode) .main-image,
html:not(.light-mode) .notes-field { background: #171b24; border-color: #303746; color: #f3f4f6; }
html:not(.light-mode) .price-chart { background: #171b24; border-color: #303746; }
html:not(.light-mode) .price-chart h3,
html:not(.light-mode) .price-chart-row strong { color: #f3f4f6; }
html:not(.light-mode) .price-chart-track { background: #303746; }
html:not(.light-mode) .product-nav-button { background: #171b24; border-color: #303746; color: #f3f4f6; }
html:not(.light-mode) .delete-product-button { background: #b4232f; border-color: #b4232f; color: #fff; }
html:not(.light-mode) .link-btn { border-color: #303746; color: #f3f4f6; }

@media (max-width: 900px) {
    .product-main { padding: 12px; gap: 12px; }
    .images-section { grid-template-columns: 150px minmax(0, 1fr); gap: 14px; padding: 14px; }
    .main-image { width: 145px; height: 145px; }
    .product-data-box { gap: 14px; padding: 14px; }
}
@media (max-width: 650px) {
    .product-title-row { align-items: stretch; flex-direction: column; gap: 10px; }
    .product-title-row h2 { font-size: 21px; }
    .product-nav-actions { flex-wrap: wrap; }
    .product-nav-button,
    .product-title-row .inventory-action { flex: 1; }
    .images-section,
    .product-data-box { grid-template-columns: 1fr; }
    .image-gallery { justify-content: flex-start; }
    .product-data-box > .sections-grid > .product-section,
    .product-data-box > .details-grid > .product-section { grid-column: 1; }
    .links-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Four-box product layout */
.product-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .72fr);
    grid-template-rows: auto auto auto 1fr;
    grid-template-areas:
        "title title"
        "summary chart"
        "heading links"
        "more links";
    align-content: start;
    gap: 14px;
    overflow-y: auto;
    overflow-x: hidden;
}

.product-main > * { width: auto; }
.product-title-row { grid-area: title; }
.images-section { grid-area: summary; }
.price-chart { grid-area: chart; align-self: start; }
.more-info-heading { grid-area: heading; }
.product-data-box { grid-area: more; }
.links-section { grid-area: links; align-self: start; margin-top: 0; }

.images-section {
    grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
    gap: 18px;
    padding: 16px;
}

.main-image { width: min(100%, 200px); height: 200px; }
.product-data-box { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.product-data-box > .sections-grid > .product-section:nth-child(1) { grid-column: 1; }
.product-data-box > .sections-grid > .product-section:nth-child(2) { grid-column: 2; }
.product-data-box > .details-grid > .product-section:nth-child(1),
.product-data-box > .details-grid > .product-section:nth-child(2),
.product-data-box > .details-grid > .product-section:nth-child(3) { grid-column: 2; }

@media (max-width: 800px) {
    .product-main {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 10px;
    }

    .product-main > * { width: 100%; }
    .images-section { grid-template-columns: 132px minmax(0, 1fr); padding: 12px; }
    .main-image { width: 124px; height: 124px; }
    .product-data-box { grid-template-columns: 1fr; gap: 12px; }
    .product-data-box > .sections-grid > .product-section,
    .product-data-box > .details-grid > .product-section { grid-column: 1; }
}