/* Oliva — site footer (includes/footer.php), dark. Design: wordpress/footer-mockup/. */

/* The Elementor footer (template 365) is replaced by this one; it stays in Elementor, only hidden. */
footer.elementor-location-footer { display: none !important; }
/* Shop all (page 253) has its own copy of the old footer as its last section (501f8b82, "Pet Atelier…"): hidden too. */
.elementor-253 > .elementor-element-501f8b82 { display: none !important; }

/* Plain text pages (Privacy, Terms, Cookies, checkout…) end right where the footer starts: give them room. Pages built
   in Elementor, products and the cart have their own spacing. */
body.page-template-default:not(.elementor-page):not(.oliva-cart-page) main.site-main { padding-bottom: 120px; }
@media (max-width: 767px) {
	body.page-template-default:not(.elementor-page):not(.oliva-cart-page) main.site-main { padding-bottom: 72px; }
}

.of {
	--fg: #f5f1ea; --fg-soft: rgba(245, 241, 234, .82); --fg-muted: rgba(245, 241, 234, .55); --rule: rgba(245, 241, 234, .16);
	--sans: "Jost", system-ui, sans-serif; --serif: "Cormorant Garamond", Georgia, serif;
	background: #3b2f2a; color: var(--fg); font: 400 13px/1.6 var(--sans); container-type: inline-size;
}
.of *, .of *::before, .of *::after { box-sizing: border-box; }
.of a, .of a:hover, .of a:focus { color: inherit; text-decoration: none; }
.of a:focus-visible, .of button:focus-visible, .of input:focus-visible { outline: 1px solid var(--fg); outline-offset: 3px; }
.of__in { max-width: 1188px; margin: 0 auto; padding: 72px 24px 40px; }
/* Product pages: as wide as their photos (1280px, 40px from the window's edge; assets/product-page.css). */
@media (min-width: 768px) { body.single-product .of__in { max-width: 1360px; padding-left: 40px; padding-right: 40px; } }
.of .of__caps { margin: 0 0 18px; font: 400 11px/1.3 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--fg); }

/* Logo and newsletter on the left; link columns on the right in two rows (Shop · Help / Oliva · Legal), as wide as
   their text, so Help and Legal end at the right edge like the logo starts at the left one. */
.of__top { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 40px 120px; grid-template-areas: "news shop help" "news oliva legal"; }
.of__news { grid-area: news; align-self: start; padding-right: 56px; }
.of__col--shop { grid-area: shop; } .of__col--help { grid-area: help; } .of__col--oliva { grid-area: oliva; } .of__col--legal { grid-area: legal; }
.of__lead { margin: 0 0 22px; font: 300 24px/1.25 var(--serif); color: var(--fg); }
.of__lead em { font-style: italic; white-space: nowrap; }
/* Email and Subscribe side by side, boxed in the same cream line (like the cart's promo code field and Apply) */
.of__field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; max-width: 420px; }
.of .of__field input { width: 100%; height: 46px; margin: 0; padding: 0 14px; border: 1px solid var(--fg); border-radius: 0; background: transparent; box-shadow: none;
	color: var(--fg); font: 400 13px/1 var(--sans); outline: none; transition: border-color .2s; }
.of .of__field input:focus { outline: 1px solid var(--fg); outline-offset: -2px; }
.of .of__field input::placeholder { color: var(--fg-muted); opacity: 1; }
.of .of__field button, .of .of__field button:focus { height: 46px; margin: 0; padding: 0 22px; border: 1px solid var(--fg); border-radius: 0; background: transparent; box-shadow: none; color: var(--fg);
	font: 400 12px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; cursor: pointer; transition: background .2s, color .2s; }
.of .of__field button:hover { background: var(--fg); color: #3b2f2a; }
.of__form.is-busy { opacity: .5; pointer-events: none; }
.of__consent { display: flex; gap: 10px; align-items: flex-start; max-width: 420px; margin-top: 14px; font-size: 11px; line-height: 1.6; color: var(--fg-muted); cursor: pointer; }
.of__consent input { flex: none; margin: 2px 0 0; accent-color: #f5f1ea; }
.of .of__consent a { text-decoration: underline; text-underline-offset: 2px; }
.of__message { margin: 12px 0 0; font-size: 12px; color: var(--fg); }
.of__message:empty { display: none; }
/* Under the newsletter: the full registered logo, in its own light colour (made for this dark background), centred
   on the email field and Subscribe (420px wide, .of__field) */
.of .of__sign { display: block; width: 150px; max-width: 100%; margin: 0 0 32px; opacity: .92; } /* above the newsletter line, on its left edge */
.of__sign img { display: block; width: 100%; height: auto; }
.of__col ul { list-style: none; margin: 0; padding: 0; }
.of__col li { margin: 0 0 8px; color: var(--fg-soft); }
.of__col li > span { color: var(--fg-muted); }
.of__col a:hover { color: var(--fg); opacity: .6; }
.of__col summary { display: block; list-style: none; pointer-events: none; } /* computers: columns always open */
.of__col summary::-webkit-details-marker { display: none; }

/* Last row: Instagram and language & currency, each a label with its value */
.of__mid { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 56px; padding-top: 18px; border-top: 1px solid var(--rule); }
.of__row { display: flex; align-items: center; gap: 16px; }
.of .of__row .of__caps { margin: 0; }
.of__locale { display: flex; gap: 10px; align-items: center; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-soft); }
.of .of__locale a[aria-current] { color: var(--fg); text-decoration: underline; text-underline-offset: 3px; }
.of__locale i { width: 1px; height: 11px; background: var(--rule); }
.of__social { display: flex; gap: 10px; align-items: center; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--fg-soft); }
.of__social svg { width: 18px; height: 18px; color: var(--fg); }

/* Tablets: a smaller gap, so the newsletter keeps its width */
@container (max-width: 1024px) {
	.of__top { column-gap: 56px; }
	.of__news { padding-right: 24px; }
}

/* Phones, compact: logo and newsletter first, then close-set rows (columns open with +, Instagram and language &
   currency as label + value). */
@container (max-width: 767px) {
	.of__in { padding: 32px 20px 20px; }
	.of__top { display: block; }
	.of__news { padding: 0 0 24px; margin-bottom: 8px; border-bottom: 1px solid var(--rule); }
	.of__lead { font-size: 20px; margin-bottom: 14px; }
	.of__field { max-width: none; }
	.of__col summary { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; cursor: pointer; pointer-events: auto; }
	.of__col summary::after { content: "+"; font-size: 15px; line-height: 1; font-weight: 300; }
	.of__col details[open] summary::after { content: "–"; }
	.of .of__col .of__caps { margin: 0; }
	.of__col ul { padding: 2px 0 10px; }
	.of__col li { margin-bottom: 6px; }
	.of__mid { display: block; margin-top: 0; padding: 0; border-top: 0; }
	.of__row { justify-content: space-between; padding: 10px 0; }
	.of__social span { display: none; }
	.of .of__sign { width: 120px; margin: 0 auto 22px; } /* phones: centred, above the newsletter line */
}