/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://example.com
 Description:  Child theme voor GeneratePress
 Author:       Jouw Naam
 Template:     generatepress
 Version:      1.0.0
 Text Domain:  generatepress-child
*/

/* Productcards gelijke hoogte */
.woocommerce ul.products li.product {
    display: flex;
    flex-direction: column;
    min-height: 360px; /* pas dit getal aan indien nodig */
}

/* Knop altijd onderin */
.woocommerce ul.products li.product .button {
    margin-top: auto;
}

/* WooCommerce prijzen in normale tekstkleur */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: #000000;
}

/* Single product add to cart knop neutraliseren */
.woocommerce div.product form.cart .button {
    background-color: #e5e5e5;
    color: #000000;
    border: 1px solid #cccccc;
    border-radius: 0;
    box-shadow: none;
    text-transform: none;
    font-weight: 400;
}

/* Hover state */
.woocommerce div.product form.cart .button:hover {
    background-color: #d5d5d5;
    color: #000000;
}

/* Producttitels in WooCommerce block grids */
.wp-block-woocommerce-product-template .wp-block-post-title {
    font-size: 1rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.5rem !important;
}

/* Maak quantity veld even hoog als Add to cart knop */
.single-product form.cart {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
}

.single-product form.cart .quantity input.qty {
    height: 48px;
    padding: 0 0.75rem;
    font-size: 1rem;
    box-sizing: border-box;
}

.single-product form.cart .single_add_to_cart_button {
    height: 48px;
    line-height: 48px;
    padding-top: 0;
    padding-bottom: 0;
}

/* Vergroot "Related products" titel */
.single-product .related > h2 {
    display: inline-block;       /* zodat de achtergrond alleen rond de letters zit */
    background-color: #f5f5f5;   /* grijze achtergrond voor h2 */
    padding: 2px 6px;            /* beetje ruimte rondom de letters */
    font-size: 16px;
    line-height: 1.3;
    margin-bottom: 1rem;
    font-weight: 500;
}

/* Kleur van het vinkje in succesmelding */
.woocommerce-message::before {
    color: #F35700; /* gewenste kleur hier */
}

/* Verwijder bovenste groene streep van WooCommerce succesmelding */
.woocommerce-message {
    border-top: none; /* verwijdert de bovenste rand */
}

/* Checkout melding: corrigeer ruimte voor het icoontje */
.woocommerce-info {
    background-color: #f5f5f5;   
    border-top: 1px solid #ccc; 
    border-left: 1px solid #ccc; 
    border-right: 1px solid #ccc; 
    border-bottom: 1px solid #ccc;
    padding: 1rem 1.5rem 1rem 3rem; /* extra padding-left voor icoontje */
    color: #000;
    position: relative;
    line-height: 1.5; /* betere uitlijning tekst */
}

/* Zorg dat het icoontje netjes blijft */
.woocommerce-info::before {
    left: 1rem; /* afstand van linkerzijde */
    top: 50%;
    transform: translateY(-50%);
}



/* Winkelwagen - wijzig kleur "Proceed to Checkout" knop */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button {
    background-color: #d3d3d3;  /* lichtgrijs */
    color: #000000;             /* tekstkleur zwart */
    border: none;               /* verwijder eventuele rand */
    box-shadow: none;           /* verwijder schaduw */
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-page .wc-proceed-to-checkout a.checkout-button:hover {
    background-color: #c0c0c0; /* iets donkerder grijs bij hover */
    color: #000000; 
}

/* Algemeen: uniforme stijl voor alle WooCommerce knoppen */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #place_order,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce-page #respond input#submit,
.woocommerce-page #place_order {
    background-color: #d3d3d3;   /* lichtgrijs */
    color: #000000;               /* zwarte tekst */
    border: none;                 /* verwijder harde randen */
    box-shadow: none;             /* verwijder schaduw */
    padding: 0.75rem 1.5rem;     /* consistente padding */
    font-size: 1rem;              /* consistente tekstgrootte */
    text-transform: none;         /* geen hoofdletters */
    border-radius: 4px;           /* subtiele afgeronde hoeken */
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover-effect: iets donkerder grijs */
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce #place_order:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover,
.woocommerce-page #respond input#submit:hover,
.woocommerce-page #place_order:hover {
    background-color: #c0c0c0;   /* donkerder grijs bij hover */
    color: #000000;               /* zwarte tekst blijft */
}

/* Eventueel focus / active states voor toegankelijkheid */
.woocommerce a.button:focus,
.woocommerce button.button:focus,
.woocommerce input.button:focus,
.woocommerce #respond input#submit:focus,
.woocommerce #place_order:focus,
.woocommerce-page a.button:focus,
.woocommerce-page button.button:focus,
.woocommerce-page input.button:focus,
.woocommerce-page #respond input#submit:focus,
.woocommerce-page #place_order:focus {
    outline: 2px solid #999999;  /* subtiele focus-indicatie */
    outline-offset: 2px;
}

/* Forceer overal hetzelfde lettertype voor paginatitels */
.wp-block-post-title,
.entry-title,
.woocommerce-products-header__title,
.single-product h1 {
    font-family: inherit !important;
}
