/**
 * Custom styles voor custom-tank pagina (Product ID: 9223)
 */

/* 1. Verberg product gallery/afbeelding */
#gallery {
    display: none !important;
}

/* 2. Maak product info kolom full width (nu gallery weg is) */
.product-info-main section > .flex > .grid.lg\:grid-cols-2 {
    display: block !important;
}
.product-info-main section > .flex > .grid.lg\:grid-cols-2 > .w-full.mb-6 {
    max-width: 100% !important;
}

/* 3. Verberg stock status sectie */
.product-info-main .flex.flex-col.sm\:flex-row.justify-between.mt-4 {
    display: none !important;
}

/* 4. Verberg alles in product-actions-section behalve add to cart row */
.product-actions-section > *:not(:first-child) {
    display: none !important;
}

/* 5. Verberg Column 2 (Product Attributes/More Information) in product sections onderaan */
.product-info-main > .grid.lg\:grid-cols-2.gap-8 > div:last-child {
    display: none !important;
}

/* 6. Maak Column 1 (Description) full width */
.product-info-main > .grid.lg\:grid-cols-2.gap-8 {
    display: block !important;
}
.product-info-main > .grid.lg\:grid-cols-2.gap-8 > .flex.flex-col.gap-6 {
    width: 100% !important;
    max-width: 100% !important;
}
.product-info-main > .grid.lg\:grid-cols-2.gap-8 .prose {
    max-width: 100% !important;
}
.product-info-main > .grid.lg\:grid-cols-2.gap-8 .card {
    max-width: 100% !important;
}

/* 7. SKU verbergen */
[itemprop="sku"],
.sku,
.my-4.flex.gap-4.items-center {
    display: none !important;
}

/* 8. Prijs verbergen */
[role="group"][aria-label="Price"],
.price-box,
.flex.flex-col.sm\:flex-row.items-end.my-4 {
    display: none !important;
}

/* 9. Quantity input verbergen in product-actions-section */
.product-actions-section > div:first-child > *:not(button[type="submit"]):not(.btn) {
    display: none !important;
}

/* 10. Grid layout voor custom options */
[data-cy="custom-options-container"] {
    display: grid !important;
    grid-template-columns: repeat(6, 1fr);
    gap: 1.5rem;
}

/* Standaard: elke optie 3 kolommen breed (50%) */
[data-cy="custom-options-container"] > div {
    grid-column: span 3;
}

/* Rij 3: Colour, Lid Size, BSP Outlets - elk 2 kolommen (33%) */
[data-cy="custom-options-container"] > div:nth-child(5),
[data-cy="custom-options-container"] > div:nth-child(6),
[data-cy="custom-options-container"] > div:nth-child(7) {
    grid-column: span 2;
}
