/*
Theme Name:   The Old Oak Tree Shop
Theme URI:    https://jenniferbradshawscott.co.uk/
Description:  Storefront child theme for the shop of Jennifer Bradshaw-Scott's picture book The Old Oak Tree, matching the author website.
Author:       Jennifer Bradshaw-Scott
Template:     storefront
Version:      1.0.1
Requires PHP: 7.4
Text Domain:  oak-tree-shop
*/

@font-face{font-family:Playfair;src:url('assets/fonts/playfair-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Playfair;src:url('assets/fonts/playfair-italic.ttf') format('truetype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:DM;src:url('assets/fonts/dm-sans.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}

:root{
  --paper:#faf7ef;
  --green:#314b39;
  --dark:#22362a;
  --olive:#6c7546;
  --olive-ink:#545d36;
  --gold:#a87d3e;
  --ink:#2a382e;
  --body:#4c5447;
  --line:#dcdccb;
  --serif:Playfair,Georgia,'Times New Roman',serif;
  --sans:DM,'Segoe UI',Arial,sans-serif;
}

body{background:var(--paper) url('assets/images/paper-grain.webp');font-family:var(--sans);color:var(--body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,.site-title,.product_title,.woocommerce-loop-product__title{font-family:var(--serif)!important;font-weight:400!important;letter-spacing:-.02em;color:var(--ink)}
h1 em,h2 em{color:var(--olive)}
a{color:var(--green)}
a:hover,a:focus{color:var(--dark)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* Announcement link back to the author website */
.oak-topbar{background:var(--green);color:#eeeedd;font-size:14px}
.oak-topbar .col-full{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:40px;flex-wrap:wrap}
.oak-topbar a{color:#f3efe1;text-decoration:underline;text-underline-offset:3px}

/* Header */
.site-header{background:transparent!important;border-bottom:1px solid var(--line);padding-top:1.4em!important}
.site-branding{display:flex;align-items:center;gap:12px}
.oak-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none!important}
.oak-brand img{width:52px;height:52px;object-fit:contain}
.oak-brand-type{font-family:var(--serif);font-size:26px;line-height:1.15;color:var(--ink);letter-spacing:-.03em}
.oak-brand-type small{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.14em;color:var(--olive-ink);margin-top:2px}
.main-navigation ul li a,.site-header-cart .cart-contents{color:var(--ink)!important;font-size:15px}
.storefront-primary-navigation{background:transparent!important}
.site-search .widget_product_search form input[type=search]{background:#fff;border:1px solid var(--line)}

/* Buttons */
button,input[type=button],input[type=reset],input[type=submit],.button,.added_to_cart,.wc-block-components-button:not(.is-link){background:var(--green)!important;border-color:var(--green)!important;color:#faf7ef!important;border-radius:6px!important;font-family:var(--sans)!important;font-weight:500!important;letter-spacing:.01em}
button:hover,input[type=submit]:hover,.button:hover,.wc-block-components-button:not(.is-link):hover{background:var(--dark)!important;border-color:var(--dark)!important}
.button.alt,.single_add_to_cart_button{padding:1em 1.8em!important}

/* Product listing and single product */
ul.products li.product img,.woocommerce-product-gallery img{border-radius:3px;box-shadow:0 0 0 1px #3c46280f,0 26px 36px -30px #2b3a2473}
ul.products li.product .price,.single-product div.product p.price{color:var(--green)!important;font-family:var(--serif);font-size:1.4em}
.single-product div.product .product_title{font-size:clamp(34px,4vw,52px);line-height:1.1}
.single-product div.product .woocommerce-product-details__short-description p{font-family:var(--serif);font-size:21px;line-height:1.5;color:var(--green)}
.woocommerce-tabs ul.tabs li.active a{color:var(--green)!important}
.onsale{background:var(--gold);border-color:var(--gold);color:#fff}
.woocommerce-breadcrumb{font-size:14px;color:var(--olive-ink)}
.woocommerce-info,.woocommerce-message{background:#e5ebdb!important;color:var(--green)!important;border-left:3px solid var(--olive)}
.woocommerce-error{background:#f4e4dc!important;color:#963a29!important}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],textarea,select{background:#fbfaf3!important;border:1px solid #c9cfba!important;border-radius:6px;font-size:16px}

/* Shop intro on the shop page */
.oak-shop-intro{text-align:center;padding:2.5em 0 1.5em}
.oak-shop-intro img{width:56px;height:56px;margin:0 auto 14px;object-fit:contain}
.oak-shop-intro .eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:.16em;color:var(--olive-ink);text-transform:uppercase}
.oak-shop-intro h1{font-size:clamp(40px,5vw,64px);margin:.3em 0 .25em}
.oak-shop-intro p{max-width:620px;margin:0 auto;font-size:18px}
.oak-badge{display:inline-flex;align-items:center;gap:10px;margin-top:1.2em;font-size:14px;color:#5c4320}
.oak-badge span{font-family:var(--serif);font-size:16px;padding:5px 12px 6px;border-radius:999px;background:linear-gradient(135deg,#ecd08b,#b88c45);color:#2b2414}

/* Footer */
.site-footer{background:var(--dark)!important;color:#dfe3d4!important}
.site-footer a{color:#f3efe1!important}
.site-footer h2,.site-footer h3,.site-footer .widget-title{color:#f7f5e9!important}
.oak-footer-note{padding:1.5em 0;font-size:14px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.storefront-handheld-footer-bar ul li>a{background:var(--green)!important;color:#faf7ef!important}

@media (max-width:767px){
  .oak-brand-type{font-size:21px}
  .oak-brand img{width:42px;height:42px}
}