/*
Theme Name: MBCO Training Child
Theme URI: https://example.com
Author: MBCO Training
Description: A child theme for the Storefront parent theme that applies the MBCO Training colour palette and styling.
Version: 1.0.0
Template: storefront
Text Domain: mbco-training-child
*/

/*
 * Declare CSS variables for the MBCO colour palette.
 * These variables can be reused throughout the child theme to ensure consistency.
 */
:root {
    --mbco-blue: #3FA9F5;
    --mbco-blue-dark: #1F6FB2;
    --mbco-orange: #F9A23B;
    --mbco-grey: #D9D9D9;
    --mbco-text: #2B2B2B;
}

/* Base text colour */
body {
    color: var(--mbco-text);
    background-color: #fff;
}

/* Header styling */
.site-header {
    background-color: var(--mbco-blue);
}

.site-header .site-title a,
.site-header .site-description,
.site-header .site-navigation a {
    color: #fff;
}

/* Footer styling */
.site-footer {
    background-color: var(--mbco-blue-dark);
    color: #fff;
    padding: 2rem 0;
}

/* Links */
a {
    color: var(--mbco-blue-dark);
}
a:hover {
    color: var(--mbco-orange);
}

/* Buttons and WooCommerce Add to Cart button */
button,
.button,
input[type="button"],
input[type="submit"] {
    background-color: var(--mbco-blue);
    color: #fff;
    border: none;
    border-radius: 14px;
    padding: 0.5rem 1rem;
    cursor: pointer;
}

button:hover,
.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover {
    background-color: var(--mbco-blue-dark);
    color: #fff;
}

/* Pricing cards or product boxes */
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
    border: 1px solid var(--mbco-grey);
    border-radius: 16px;
    overflow: hidden;
}

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
    border-bottom: 1px solid var(--mbco-grey);
}

.woocommerce ul.products li.product .price, .woocommerce-page ul.products li.product .price {
    color: var(--mbco-blue-dark);
    font-weight: bold;
}

/* WooCommerce sale badge */
.woocommerce span.onsale {
    background-color: var(--mbco-orange);
    color: #fff;
    border-radius: 100%;
}

/*
 * Header menu link styling
 * Force white text and add a subtle border that turns white on hover.
 */
.site-header ul.menu > li > a {
    color: #fff;
    border: 1px solid transparent;
    padding: 0.5rem 1rem;
    transition: border-color 0.2s, color 0.2s;
}

.site-header ul.menu > li > a:hover,
.site-header ul.menu > li > a:focus {
    color: #fff;
    border-color: #fff;
}

/*
 * Footer menu link styling
 * Links are white and gain a white border on hover.
 */
.site-footer ul.menu > li > a {
    color: #fff;
    border: 1px solid transparent;
    padding: 0.5rem 1rem;
}

.site-footer ul.menu > li > a:hover,
.site-footer ul.menu > li > a:focus {
    color: #fff;
    border-color: #fff;
}

/*
 * Remove the “Built with WooCommerce” credit line.
 */
.site-info {
    display: none;
}

/*
 * Hide the “Shop by Brand” section on the homepage.
 * Targets common classes used by the Storefront theme and brand plugins.
 */
.home .storefront-product-brands,
.home section.storefront-product-brands,
.home .storefront-homepage-section-brands,
.home #product_brands,
.home .brand-section {
    display: none !important;
}