/*
Theme Name: Mantle (Ollie Child)
Template: ollie
Description: Mantle Products child theme for Ollie. Recreates the original Divi design.
Version: 1.1.4
Text Domain: mantle-ollie
*/

/* Sticky header like the Divi fixed nav */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: 0; z-index: 100; background: #fff; box-shadow: 0 1px 0 rgba(0,0,0,.1); }
body.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { body.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; } }
.wp-site-blocks > main, .wp-site-blocks > footer, .wp-site-blocks > header + * { margin-block-start: 0; }

/* Header menu */
.mantle-header .wp-block-navigation .wp-block-navigation-item__content { color: rgba(0,0,0,.6); }
.mantle-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: rgba(0,0,0,.8); text-decoration: none; }
.mantle-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { color: #2ea3f2; }
.mantle-header .wp-block-navigation__submenu-container { border: 0 !important; border-top: 3px solid #2ea3f2 !important; box-shadow: 0 2px 5px rgba(0,0,0,.1); padding: 20px 0; min-width: 240px !important; }
.mantle-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 6px 20px; }
.mantle-header .wp-block-image { margin: 0; }
.mantle-header .wc-block-mini-cart__button { color: #000; padding: 0; }

/* Buttons: Divi-style underline buttons */
.wp-element-button, .wp-block-button__link {
  background: transparent; color: inherit; border: 0; border-bottom: 1px solid currentColor; border-radius: 0;
  padding: 4px 30px 4px 0; font-weight: 600; position: relative; transition: padding .2s;
}
.wp-element-button::after, .wp-block-button__link::after { content: "\2192"; position: absolute; right: 6px; opacity: 0; transition: opacity .2s, right .2s; }
.wp-element-button:hover::after, .wp-block-button__link:hover::after { opacity: 1; right: 4px; }
.wp-element-button:hover, .wp-block-button__link:hover { background: transparent; color: inherit; text-decoration: none; }

/* Footer */
.mantle-footer-cta .wp-block-heading { margin-top: 0; }
.mantle-footer-bottom .mantle-footer-links { list-style: none; padding: 0; margin: 0; }
.mantle-footer-bottom .mantle-footer-links li { padding-bottom: 11px; line-height: 1; }
.mantle-footer-bottom a { text-decoration: none; }
.mantle-footer-bottom a:hover { text-decoration: underline; }
.mantle-footer-bottom .wp-block-columns { margin-bottom: 0; }
@media (max-width: 781px) { .mantle-footer-bottom .wp-block-buttons { justify-content: flex-start; } }

/* Mailchimp form styling */
.mantle-footer-cta label { display: block; font-size: 18px; color: #000; }
.mantle-footer-cta input[type=email], .mantle-footer-cta input[type=text] { width: 100%; border: 1px solid #abb0b2; border-radius: 3px; padding: 8px; font-family: inherit; margin-bottom: 12px; }
.mantle-footer-cta input[type=submit] { background: #e2c190; color: #622212; font-weight: 600; font-size: 18px; border: 0; border-radius: 0; padding: 0 22px; height: 32px; font-family: inherit; cursor: pointer; }

/* Header tweaks */
.mantle-header .wp-block-woocommerce-customer-account { display: none; }
.mantle-header .wp-block-navigation .wp-block-navigation-item__content { text-decoration: none !important; }
.mantle-header .wc-block-mini-cart__badge { display: none; }
.mantle-footer-bottom .wp-block-button__link { color: #fff; }
.mantle-footer-bottom > p:last-child { text-align: center; }

/* Mailchimp: match the live site */
.mantle-footer-cta #mc_embed_signup { background: transparent; font-family: inherit; width: 100%; }
.mantle-footer-cta #mc_embed_signup form { padding: 0; }
.mantle-footer-cta #mc_embed_signup .mc-field-group { width: 100%; padding-bottom: 0; min-height: 0; }
.mantle-footer-cta #mc_embed_signup .mc-field-group label { font-size: 18px; font-weight: 500; line-height: 1.7; padding-bottom: 0; }
.mantle-footer-cta #mc_embed_signup .mc-field-group input { font-family: inherit; text-indent: 0; padding: 8px; margin-bottom: 0; }
.mantle-footer-cta #mc_embed_signup .button { font-family: inherit; height: 32px; line-height: 32px; padding: 0 22px; margin: 16px 0 0; width: auto; }
.mantle-footer-cta #mc_embed_signup .clear.foot { display: block; }

/* Divi-like heading spacing: headings sit close to the text below */
main :where(h1,h2,h3,h4,h5,h6) + p { margin-block-start: 10px; }

/* Product grids on pages ([products] shortcode) - match Divi Shop module */
main .woocommerce ul.products { margin-top: 0; }
main .woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: var(--wp--preset--font-family--primary); font-size: 18px; font-weight: 500; line-height: 24px; color: #000; padding: 9px 0; margin: 0; }
main .woocommerce ul.products li.product img { margin: 0 0 9px; }
main .woocommerce ul.products li.product .price { font-size: 14px; font-weight: 400; color: #666; line-height: 26px; }
main .woocommerce ul.products li.product .button, main .woocommerce ul.products li.product .added_to_cart { display: none; }
main .woocommerce ul.products li.product a { text-decoration: none; }

/* Contact form - match Divi contact form look */
.mantle-divi-form .grunion-field-label, .mantle-divi-form label.grunion-field-label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mantle-divi-form input[type=text], .mantle-divi-form input[type=email], .mantle-divi-form input[type=tel], .mantle-divi-form textarea {
  background: #eee !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 16px !important; font-size: 14px; font-family: inherit; color: #4e4e4e; width: 100%;
}
.mantle-divi-form textarea { min-height: 150px; }
.mantle-divi-form ::placeholder { color: #999; opacity: 1; }
.mantle-divi-form .wp-block-jetpack-button, .mantle-divi-form .contact-submit { text-align: right; margin-left: auto; }
.mantle-divi-form .wp-block-jetpack-button .wp-block-button__link, .mantle-divi-form button[type=submit] { background: transparent; color: #000; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; padding: 4px 30px 4px 0; font-weight: 600; font-size: 18px; font-family: inherit; }

/* Home hero */
.mantle-hero { background-color: #222; }
.mantle-hero h1, .mantle-hero h3 { text-shadow: 2px 2px 4px rgba(0,0,0,.5); }
.mantle-hero .wp-block-button__link { color: #fff; }
@media (max-width: 781px) { .mantle-hero h1 { font-size: 44px !important; } }

/* Mobile header: smaller logo, keep menu + cart from being squeezed */
.mantle-header .mantle-header-right { flex-shrink: 0; }
.mantle-header > .wp-block-image { flex-shrink: 1; min-width: 0; }
@media (max-width: 980px) {
  .mantle-header { padding-left: 20px !important; padding-right: 20px !important; }
  .mantle-header > .wp-block-image img { width: 180px !important; height: auto; }
}
@media (max-width: 600px) {
  .mantle-header > .wp-block-image img { width: 140px !important; }
  .mantle-header .mantle-header-right { gap: 16px; }
}

/* Mobile footer: center everything like the live site */
@media (max-width: 781px) {
  .mantle-footer-bottom .wp-block-column { text-align: center; }
  .mantle-footer-bottom .wp-block-image { margin-left: auto; margin-right: auto; display: table; }
  .mantle-footer-bottom .mantle-footer-links { display: inline-block; text-align: center; }
  .mantle-footer-bottom .wp-block-buttons { justify-content: center !important; }
}

/* Mobile signup section: use the full width */
@media (max-width: 781px) {
  .mantle-footer-cta { padding-left: 20px !important; padding-right: 20px !important; padding-top: 50px !important; padding-bottom: 50px !important; }
  .mantle-footer-cta > .wp-block-columns { max-width: 100% !important; }
  .mantle-footer-cta #mc_embed_signup .mc-field-group input { padding: 10px; }
  .mantle-footer-cta #mc_embed_signup .button { width: 100%; }
}

.mantle-footer-cta #mc_embed_signup input, .mantle-footer-cta #mc_embed_signup .button { box-sizing: border-box; }
.mantle-footer-cta #mc_embed_signup .clear.foot, .mantle-footer-cta #mc_embed_signup .optionalParent { width: 100%; margin: 0; padding: 0; }

/* Icon rows (5 columns: Home capabilities, Our Story values) on mobile: 2 per row, small icons */
@media (max-width: 781px) {
  .wp-block-columns:has(> .wp-block-column:nth-child(5)) { flex-wrap: wrap !important; row-gap: 30px; column-gap: 4% !important; }
  .wp-block-columns:has(> .wp-block-column:nth-child(5)) > .wp-block-column { flex-basis: 48% !important; flex-grow: 0 !important; }
  .wp-block-columns:has(> .wp-block-column:nth-child(5)) > .wp-block-column:has(h2) { flex-basis: 100% !important; }
  .wp-block-columns:has(> .wp-block-column:nth-child(5)) .wp-block-image { max-width: 90px; margin-left: auto !important; margin-right: auto !important; }
  .wp-block-columns:has(> .wp-block-column:nth-child(5)) .wp-block-image img { width: 100% !important; height: auto; }
}

/* Mobile: center headings and short copy (long paragraphs stay left) */
@media (max-width: 781px) {
  .mantle-center-mobile { text-align: center !important; }
  .wp-block-buttons.mantle-center-mobile { justify-content: center !important; }
  .wp-block-post-content > .wp-block-group:first-child h1 { text-align: center; }
  .wp-block-post-content .wp-block-image.aligncenter, .wp-block-post-content .wp-block-column > .wp-block-image { margin-left: auto; margin-right: auto; }
}

.mantle-footer-cta #mc_embed_signup form#mc-embedded-subscribe-form { margin: 0; padding: 0; }
@media (max-width: 781px) {
  .mantle-footer-cta .wp-block-heading, .mantle-footer-cta > .wp-block-columns > .wp-block-column:first-child p { text-align: center; }
}

/* Text styles (also selectable in the editor's Styles panel) */
.is-style-mantle-subhead { font-family: var(--wp--preset--font-family--primary) !important; font-size: 24px; font-weight: 700; line-height: 1.1; color: #333; }
.is-style-mantle-tagline { font-family: var(--wp--preset--font-family--primary); font-size: 24px; font-weight: 700; line-height: 1.15; color: var(--wp--preset--color--primary); }
.is-style-mantle-label { font-weight: 700; font-size: 20px; line-height: 1.2; color: #333; }
:where(h1,h2,h3,h4) + .is-style-mantle-tagline { margin-block-start: 10px; }

/* Mobile: use more of the screen width (desktop keeps the 80% Divi-style width) */
@media (max-width: 781px) {
  :root { --wp--style--global--content-size: 100%; --wp--style--global--wide-size: 100%; --wp--style--root--padding-left: 20px; --wp--style--root--padding-right: 20px; }
  .wp-block-post-content .has-global-padding { padding-left: 20px; padding-right: 20px; }
  main .woocommerce ul.products { column-gap: 16px; }
  main .woocommerce ul.products li.product { width: calc(50% - 8px) !important; margin-right: 0 !important; }
}

@media (max-width: 781px) {
  .mantle-hero .homeherocopy { line-height: 1.3 !important; font-size: 20px !important; }
  .mantle-hero { min-height: 520px !important; padding-top: 60px !important; padding-bottom: 60px !important; }
}

/* Contact form (Formidable) - Divi-style gray fields */
.mantle-contact-form .frm_forms, .frm_forms.frm_style_formidable-style.with_frm_style { --field-font-size: 14px; }
.wp-block-post-content .frm_forms form input[type=text], .wp-block-post-content .frm_forms form input[type=email], .wp-block-post-content .frm_forms form input[type=tel], .wp-block-post-content .frm_forms form textarea {
  background: #eee !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 16px !important; font-family: inherit !important; font-size: 15px !important; color: #4e4e4e !important; height: auto !important;
}
.wp-block-post-content .frm_forms form textarea { min-height: 150px; }
.wp-block-post-content .frm_forms label.frm_primary_label { font-family: inherit; font-size: 15px; font-weight: 600; color: #333; }
.wp-block-post-content .frm_forms .frm_description { font-size: 12px; color: #777; }
.wp-block-post-content .frm_forms .frm_submit { text-align: right; }
.wp-block-post-content .frm_forms .frm_submit button, .wp-block-post-content .frm_forms .frm_submit input[type=submit] {
  background: transparent !important; color: #000 !important; border: 0 !important; border-bottom: 1px solid currentColor !important; border-radius: 0 !important; box-shadow: none !important; padding: 4px 30px 4px 0 !important; font-family: inherit !important; font-weight: 600 !important; font-size: 18px !important; height: auto !important;
}