/*
Theme Name: GoodFuel
Description:
Author: Rein van der Woerd
Author URI: rein.computer
Version: 0.0.1
*/



/*
|--------------------------------------------------------------------------
| Color palette and general
|--------------------------------------------------------------------------
*/
body {
    /*--sand: orange;*/
    /*--darkred: darkred;*/
    /*--olive: olive;*/

    --beige: #cec2a9;
    --beige-2: #d9d1be;
    /*--beige-darker:*/
    --sand: orange;
    --darkred: darkred;
    --orange: #DF701B;
    --olive: #7E8E5B;
    --brown-1: #39261F;
    --brown-2: #443608;

    padding: 20px;
    --main-column-width: 1000px;

    background: url("./img/textures/magazine paper 1 - cleaned.webp");
    background-size: 190%;
    /*background-size: cover;*/

    --headings-font-family: 'PP Frama';
    --main-font-family: 'PP Frama Text';

    --letter-spacing: -.05em !important;

    --nav-button-border-radius: 14px;

    font-family: var(--main-font-family);
}

::selection {
    background: var(--beige);
}

/*
|--------------------------------------------------------------------------
| General elements
|--------------------------------------------------------------------------
*/
p a {
    color: inherit;
}

h1, h2, h3 {
    /*letter-spacing: var(--letter-spacing);*/
    font-family: var(--headings-font-family);
}

h3 {
    /*font-family: */
    font-weight: lighter;
    margin: 0;
}





/*
|--------------------------------------------------------------------------
| Nav
|--------------------------------------------------------------------------
*/

nav {
    margin: auto;
    display: flex;
    width: max-content;
    gap: 10px;
    padding-top: 30px;
    margin-bottom: 50px;
}

nav a {
    padding: 9px 18px;
    background: var(--brown-1);
    color: beige;
    mix-blend-mode: multiply;
    text-decoration: none;
    border-radius: 14px;
    font-weight: bold;
    letter-spacing: -0.06em !important;
}

nav a.current {
    background: var(--olive) !important;
}

nav a:hover {
    background: var(--olive);
    cursor: pointer;
}

nav a[href="#order-now"] {
    background: var(--orange);
}


/*
|--------------------------------------------------------------------------
| Coming soon
|--------------------------------------------------------------------------
*/
.coming-soon {
    max-width: 800px;
    margin: auto;
    padding: 40px;

    font-family: 'Futura';
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.coming-soon h1 {
    margin-bottom: 5px;
    line-height: 1;
}


/*
|--------------------------------------------------------------------------
| Sections
|--------------------------------------------------------------------------
*/
section {
    max-width: var(--main-column-width);
    display: flex;
    margin: auto;
    position: relative;
    flex-direction: column;
}


/*
|--------------------------------------------------------------------------
| Splash
|--------------------------------------------------------------------------
*/

.splash img:not(.sticker) {
    width: 100%;
    mix-blend-mode: multiply;
}

section.title {
    margin-bottom: 75px;
}

/*
|--------------------------------------------------------------------------
| About section
|--------------------------------------------------------------------------
*/

section.about h2 {
    display: none;
}

.about-text {
    column-count: 2;
    column-gap: 40px;
    text-align: justify;
    padding: 20px 0;
    margin-top: 0 !important;
}

.about-text h3 {
    display: inline;
    font-weight: 500;
    color: var(--orange);
}

/*
|--------------------------------------------------------------------------
| Review
|--------------------------------------------------------------------------
*/

.review .text {
    max-width: 600px;
}


/*
|--------------------------------------------------------------------------
| GoodFuel title
|--------------------------------------------------------------------------
*/
.title-goodfuel {
    width: 100%;
    margin-top: 10px;
    /*border-top: 8px solid var(--orange);*/
    padding-top: 15px;
    /*border-bottom: 8px solid var(--olive);*/
    padding-bottom: 5px;
}

/*
|--------------------------------------------------------------------------
| Stickers
|--------------------------------------------------------------------------
*/
.sticker {
    position: absolute;
}


/*
|--------------------------------------------------------------------------
| Ingredients
|--------------------------------------------------------------------------
*/
.ingredients {
    background: white;
    padding: 20px;
    border: 1px solid;
}


/*
|--------------------------------------------------------------------------
| WooCommerce Account
|--------------------------------------------------------------------------
*/


/*.woocommerce-MyAccount-navigation {*/
/*    border-image: url('/wp-content/themes/goodfuel/img/lines/border-line.png') fill*/
/*    10 10 10 10 /*/
/*      20 20 20 20 /*/
/*      0 0 0 0;*/
/*    width: max-content !important;*/
/*    border-image-repeat: repeat !important;*/

/*}*/

.woocommerce-MyAccount-navigation {
    /*background-image: url('https://goodfuel.now/wp-content/themes/goodfuel/img/lines/line 2 - vertical.png');*/
    background-size: 10px 2000px;
    background-repeat: no-repeat;
    background-position: 100% 0%;
}

.woocommerce h1 {
    text-transform: capitalize !important;
}
.woocommerce {
    max-width: var(--main-column-width);
    margin: auto;
}

.woocommerce-account main {
    max-width: var(--main-column-width);
    margin: auto;
}

.woocommerce-MyAccount-content {
    padding-top: 30px;
}

.woocommerce-MyAccount-content p:first-of-type {
    margin-top: 0;
}

.woocommerce-account nav ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.woocommerce-account nav li {
    display: flex;
}

.woocommerce-MyAccount-navigation-link.is-active a {
    background: var(--olive);
}

.woocommerce-Address .edit {
    color: currentColor;
}


/* Info messages */
.woocommerce-error, .woocommerce-info, .woocommerce-message {
    background: transparent;
    border: 2px solid;
    border-radius: 10px;
    font-weight: bold;
    letter-spacing: var(--letter-spacing);
    color: var(--brown-1);
}

/* Info icon */
.woocommerce-info::before { /* icon */
    color: var(--olive);
    top: 1.1em;
}

/* Button */
.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-info .button, .woocommerce .woocommerce-message .button, .woocommerce-page .woocommerce-error .button, .woocommerce-page .woocommerce-info .button, .woocommerce-page .woocommerce-message .button {
    background: white;
    border-radius: var(--nav-button-border-radius);
}
.woocommerce .button {
    color: inherit !important;
}

.woocommerce .button:hover {
    background: var(--beige-2) !important;
}


/*.woocommerce img, .woocommerce-page img {*/
/*    width: unset;*/
/*}*/



/*
|--------------------------------------------------------------------------
| Cart and checkout
|--------------------------------------------------------------------------
*/
.wp-block-woocommerce-cart, .wc-block-checkout, .woocommerce-cart main {
    max-width: var(--main-column-width);
    margin: auto;
}


.wc-block-components-product-name
/*.wc-block-components-totals-item.wc-block-components-totals-footer-item .wc-block-components-formatted-money-amount {*/
{
    font-weight: bold !important;
    color: inherit;
    font-size: 16px !important;
    text-decoration: none;
}

.wc-block-components-totals-item.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-item.wc-block-components-totals-footer-item .wc-block-components-formatted-money-amount {
    font-size: 16px !important;
}

.wc-block-components-totals-item__label {
    font-weight: bold !important;
}

/* Checkout button */
.wc-block-components-button.wp-element-button.wc-block-cart__submit-button {
    background: var(--brown-1);
    /*border-radius: var(--nav-button-border-radius);*/
    border-radius: 5px;
    font-weight: bold;
}

.wc-block-components-button.wp-element-button.wc-block-cart__submit-button:hover {
    background: var(--orange);
}


/* Cart item image */
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image img {
    width: 120px !important;
    height: 120px;
    max-width: unset;
}


/*
|--------------------------------------------------------------------------
| Store
|--------------------------------------------------------------------------
*/
#coming-soon-footer-banner {
    display: none;
}