/* APC Outdoor — single product page (Lowe's-faithful replica)
   100% custom HTML — all classes are apc-*. */

.apc-product {
    --p-fg: #1a1a1a;
    --p-fg-2: #333;
    --p-fg-muted: #6a6a6a;
    --p-fg-light: #999;
    --p-bg: #ffffff;
    --p-bg-soft: #f8f7f4;
    --p-bg-pale: #f3f3f3;
    --p-line: #d8d8d8;
    --p-line-light: #ececec;
    --p-link: #1a5fb4;
    --p-brand: #2D4A3A;
    --p-brand-dark: #1F3A2C;
    --p-red: #c0292d;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--p-fg);
    background: var(--p-bg);
    -webkit-font-smoothing: antialiased;
    line-height: 1.45;
}

/* === 1. Breadcrumb === */
.apc-product__crumbs {
    max-width: 1290px;
    margin: 18px auto 0;
    padding: 0 32px;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.apc-product__crumbs a {
    color: var(--p-link);
    text-decoration: none;
}
.apc-product__crumbs a:hover { text-decoration: underline; }
.apc-product__crumbs-sep { color: var(--p-fg-light); }

/* === 2. HERO LAYOUT === */
.apc-product__hero {
    max-width: 1290px;
    margin: 24px auto 56px;
    padding: 0 32px;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 48px;
    align-items: start;
}

/* === Gallery === */
.apc-gallery { display: flex; flex-direction: column; gap: 14px; }
.apc-gallery__main-wrap {
    position: relative;
    background: var(--p-bg-pale);
    border-radius: 4px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.apc-gallery__main {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    padding: 32px;
    box-sizing: border-box;
}
.apc-gallery__nav {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--p-line);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--p-fg);
    transition: background-color .15s, transform .15s;
    box-shadow: 0 2px 4px rgba(0,0,0,.06);
}
.apc-gallery__nav:hover { background: #f5f5f5; transform: translateY(-50%) translateX(2px); }

.apc-gallery__strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}
.apc-gallery__thumb {
    position: relative;
    background: #fff;
    border: 1px solid var(--p-line);
    border-radius: 3px;
    aspect-ratio: 1 / 1;
    cursor: pointer;
    padding: 6px;
    transition: border-color .15s;
}
.apc-gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.apc-gallery__thumb:hover { border-color: var(--p-fg-2); }
.apc-gallery__thumb.is-active { border-color: var(--p-fg); border-width: 2px; padding: 5px; }
.apc-gallery__thumb.has-overlay { position: relative; }
.apc-gallery__thumb.has-overlay::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,.78);
}
.apc-gallery__overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: var(--p-fg);
    z-index: 1;
}

/* === Summary === */
.apc-summary { padding-top: 4px; }
.apc-summary__price-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}
.apc-summary__price {
    font-size: 36px;
    font-weight: 800;
    color: var(--p-fg);
    line-height: 1;
    letter-spacing: -0.02em;
    display: inline-flex;
    align-items: flex-start;
}
.apc-summary__price .woocommerce-Price-currencySymbol { font-weight: 600; font-size: 22px; vertical-align: top; margin-left: 2px; }
.apc-summary__price-curr {
    font-size: 22px;
    font-weight: 600;
    margin-right: 2px;
    margin-top: 4px;
}
.apc-summary__price-cents {
    font-size: 22px;
    font-weight: 700;
    margin-top: 4px;
}
.apc-summary__price-old {
    font-size: 14px;
    color: var(--p-fg-muted);
    text-decoration: line-through;
}
.apc-summary__price-save {
    font-size: 13px;
    color: var(--p-red);
    font-weight: 700;
}

.apc-summary__title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.32;
    color: var(--p-fg-2);
    margin: 14px 0 4px;
}

.apc-summary__ids {
    font-size: 12px;
    color: var(--p-fg-muted);
    margin: 0 0 14px;
}

.apc-summary__features {
    list-style: disc;
    padding-left: 20px;
    margin: 14px 0 22px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--p-fg-2);
}
.apc-summary__features li { margin-bottom: 6px; }
.apc-summary__features li::marker { color: var(--p-fg-muted); }

/* === Buy form === */
.apc-buy { margin: 0; padding: 18px 0 0; border-top: 1px solid var(--p-line-light); }
.apc-buy__field { margin-bottom: 14px; }
.apc-buy__label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: var(--p-fg);
    margin-bottom: 6px;
}
.apc-buy__select {
    width: 100%;
    border: 1px solid var(--p-line);
    border-radius: 3px;
    padding: 11px 36px 11px 14px;
    font-size: 14px;
    color: var(--p-fg);
    background-color: #fff;
    appearance: none;
    cursor: pointer;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23333' stroke-width='1.5'/></svg>");
    background-repeat: no-repeat;
    background-position: right 14px center;
}
.apc-buy__select:focus {
    border-color: var(--p-brand);
    outline: none;
    box-shadow: 0 0 0 3px rgba(45,74,58,.12);
}

.single_variation_wrap .single_variation .price {
    font-size: 24px;
    font-weight: 800;
    color: var(--p-fg);
    margin: 8px 0 12px;
}
.single_variation_wrap .stock {
    font-size: 13px;
    margin: 0 0 10px;
    font-weight: 500;
    color: #1a7c3e;
}
.single_variation_wrap .stock.out-of-stock { color: var(--p-red); }

.apc-buy__row {
    display: flex;
    gap: 10px;
    margin-top: 14px;
    align-items: stretch;
}

/* Quantity stepper */
.apc-buy__qty {
    display: flex;
    align-items: center;
    border: 1px solid var(--p-line);
    border-radius: 3px;
    overflow: hidden;
    height: 50px;
    background: #fff;
}
.apc-buy__qty-btn {
    width: 40px;
    height: 100%;
    background: #fff;
    border: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--p-fg);
    cursor: pointer;
    transition: background-color .15s;
}
.apc-buy__qty-btn:hover { background: var(--p-bg-pale); }
.apc-buy__qty-input {
    width: 44px;
    height: 100%;
    border: 0;
    border-left: 1px solid var(--p-line);
    border-right: 1px solid var(--p-line);
    text-align: center;
    font-size: 15px;
    font-weight: 600;
    color: var(--p-fg);
    background: #fff;
    -moz-appearance: textfield;
}
.apc-buy__qty-input::-webkit-outer-spin-button,
.apc-buy__qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.apc-buy__qty-input:focus { outline: none; }

.apc-buy__cta {
    flex: 1;
    height: 50px;
    background: var(--p-brand);
    color: #fff;
    border: 0;
    border-radius: 3px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    cursor: pointer;
    transition: background-color .18s;
}
.apc-buy__cta:hover,
.apc-buy__cta:focus { background: var(--p-brand-dark); }
.apc-buy__cta:disabled,
.apc-buy .wc-variation-selection-needed .apc-buy__cta {
    opacity: .35;
    cursor: not-allowed;
}

/* === 3. OVERVIEW === */
.apc-overview {
    border-top: 1px solid var(--p-line-light);
    border-bottom: 1px solid var(--p-line-light);
    background: #fff;
    padding: 56px 32px;
}
.apc-overview__inner {
    max-width: 900px;
    margin: 0 auto;
}
.apc-overview__list {
    list-style: disc;
    padding-left: 22px;
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--p-fg-2);
}
.apc-overview__list li { margin-bottom: 10px; }
.apc-overview__list li::marker { color: var(--p-fg-muted); }

/* === 4. COMPARE === */
.apc-compare {
    max-width: 1290px;
    margin: 56px auto 80px;
    padding: 0 32px;
}
.apc-compare__title {
    font-size: 22px;
    font-weight: 800;
    color: var(--p-fg);
    text-align: center;
    margin: 0 0 36px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.apc-compare__table {
    border: 1px solid var(--p-line);
    border-radius: 4px;
    background: #fff;
    overflow: hidden;
}
.apc-compare__row {
    display: grid;
    grid-template-columns: 180px repeat(3, 1fr);
    align-items: center;
    border-bottom: 1px solid var(--p-line-light);
    min-height: 56px;
}
.apc-compare__row:last-child { border-bottom: 0; }
.apc-compare__row--images { grid-template-columns: 180px repeat(3, 1fr); }
.apc-compare__row--images,
.apc-compare__row--titles,
.apc-compare__row--cta {
    grid-template-columns: 180px 1fr 1fr 1fr;
}
.apc-compare__row--images .apc-compare__cell,
.apc-compare__row--titles .apc-compare__cell,
.apc-compare__row--cta .apc-compare__cell { grid-column: span 1; }

/* Push first cell of image/title/cta rows under the value cells (skip the label slot) */
.apc-compare__row--images .apc-compare__cell:first-child,
.apc-compare__row--titles .apc-compare__cell:first-child,
.apc-compare__row--cta .apc-compare__cell:first-child {
    grid-column: 2;
}
.apc-compare__row--images .apc-compare__cell:nth-child(2) { grid-column: 3; }
.apc-compare__row--images .apc-compare__cell:nth-child(3) { grid-column: 4; }
.apc-compare__row--titles .apc-compare__cell:nth-child(2) { grid-column: 3; }
.apc-compare__row--titles .apc-compare__cell:nth-child(3) { grid-column: 4; }
.apc-compare__row--cta .apc-compare__cell:nth-child(2) { grid-column: 3; }
.apc-compare__row--cta .apc-compare__cell:nth-child(3) { grid-column: 4; }

.apc-compare__row-label {
    padding: 14px 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--p-fg-2);
    background: var(--p-bg-soft);
    border-right: 1px solid var(--p-line-light);
    grid-column: 1;
}

.apc-compare__cell {
    padding: 14px 18px;
    text-align: center;
    border-right: 1px solid var(--p-line-light);
}
.apc-compare__cell:last-child { border-right: 0; }

.apc-compare__row--images .apc-compare__cell { padding: 24px 18px 12px; }
.apc-compare__img-link { display: block; }
.apc-compare__img-link img {
    width: 100%;
    max-width: 200px;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    margin: 0 auto;
    display: block;
}

.apc-compare__title-link {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--p-fg-2);
    text-decoration: none;
    line-height: 1.4;
    padding: 4px 4px 18px;
}
.apc-compare__title-link:hover { color: var(--p-link); }

.apc-compare__cta {
    display: inline-block;
    padding: 11px 24px;
    background: var(--p-brand);
    color: #fff;
    border-radius: 3px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: background-color .18s;
}
.apc-compare__cta:hover { background: var(--p-brand-dark); color: #fff; }

.apc-compare__price {
    font-size: 16px;
    font-weight: 700;
    color: var(--p-fg);
}

/* === Responsive === */
@media (max-width: 991px) {
    .apc-product__hero { grid-template-columns: 1fr; gap: 32px; padding: 0 24px; }
    .apc-overview { padding: 40px 24px; }
    .apc-compare { padding: 0 24px; margin: 40px auto 64px; }
    .apc-compare__row { grid-template-columns: 100px 1fr 1fr 1fr; }
    .apc-compare__row--images,
    .apc-compare__row--titles,
    .apc-compare__row--cta { grid-template-columns: 100px 1fr 1fr 1fr; }
}
@media (max-width: 640px) {
    .apc-product__crumbs { padding: 0 16px; font-size: 12px; }
    .apc-product__hero { padding: 0 16px; }
    .apc-summary__price { font-size: 26px; }
    .apc-overview { padding: 32px 16px; }
    .apc-compare { padding: 0 16px; }
    /* Stack compare table */
    .apc-compare__row,
    .apc-compare__row--images,
    .apc-compare__row--titles,
    .apc-compare__row--cta { grid-template-columns: 1fr 1fr 1fr; }
    .apc-compare__row-label { display: none; }
    .apc-compare__row--images .apc-compare__cell:first-child,
    .apc-compare__row--titles .apc-compare__cell:first-child,
    .apc-compare__row--cta .apc-compare__cell:first-child { grid-column: 1; }
    .apc-compare__row--images .apc-compare__cell:nth-child(2),
    .apc-compare__row--titles .apc-compare__cell:nth-child(2),
    .apc-compare__row--cta .apc-compare__cell:nth-child(2) { grid-column: 2; }
    .apc-compare__row--images .apc-compare__cell:nth-child(3),
    .apc-compare__row--titles .apc-compare__cell:nth-child(3),
    .apc-compare__row--cta .apc-compare__cell:nth-child(3) { grid-column: 3; }
    .apc-buy__row { flex-wrap: wrap; }
    .apc-buy__cta { flex: 1 0 100%; }
}
