/* Podi Junction — small additions to theme.json. Colours and fonts are set in Appearance → Editor → Styles. */

/* Brand pattern (the supplied original artwork) as a subtle background */
.pj-pattern-bg { position: relative; isolation: isolate; }
.pj-pattern-bg::before {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: url(../images/brand-pattern.png) no-repeat center / cover;
	opacity: .09;
}

/* Header */
.pj-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(91, 56, 27, .14); }
.admin-bar .pj-header { top: var(--wp-admin--admin-bar--height, 32px); }
.pj-logo img { height: auto; }
@media (max-width: 781px) { .pj-header .pj-logo { width: 92px !important; } .pj-header .pj-logo img { width: 92px !important; } }

/* Eyebrow label */
.pj-eyebrow { font-size: .8rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--terracotta); margin-bottom: .25rem; }
.pj-putnalu .pj-eyebrow { color: var(--wp--preset--color--cream-deep); opacity: .8; }

/* Hero */
.pj-hero-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; box-shadow: 0 30px 60px -36px rgba(62, 36, 16, .6); }
@media (max-width: 781px) {
	.pj-hero-cols { flex-direction: column-reverse; }
	.pj-buttons .wp-block-button { width: 100%; }
	.pj-buttons .wp-block-button__link { width: 100%; }
}

/* Cards */
.pj-card { background: var(--wp--preset--color--white); border-radius: var(--wp--custom--radius); padding: 0 0 1.25rem; overflow: hidden; box-shadow: 0 1px 0 rgba(91, 56, 27, .08), 0 16px 34px -26px rgba(62, 36, 16, .45); }
.pj-card > *:not(.wp-block-image) { margin-left: 1.1rem; margin-right: 1.1rem; }
.pj-card .wp-block-image { margin: 0 0 1rem; }
.pj-card .wp-block-image img { border-radius: 0; }
.pj-square img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.pj-card-title { text-transform: uppercase; font-size: 1rem; letter-spacing: .03em; margin-top: 0; }
.pj-ingredients .pj-card-title { text-align: center; }
.pj-ingredients .pj-card > p { text-align: center; }
.pj-card-link a { font-weight: 600; text-decoration: none; }
.pj-card-link a:hover { text-decoration: underline; }
.pj-ingredients .pj-card { padding-top: 0; }

/* A photo slot with nothing uploaded renders nothing; hide the empty column it leaves behind */
.wp-block-column:not(:has(*)) { display: none; }

/* Powered by putnalu */
.pj-putnalu .wp-block-image img { border-radius: var(--wp--custom--radius); }

/* FAQ / details */
.wp-block-details summary { cursor: pointer; font-weight: 600; }

/* Placeholder boxes for text the brand still has to supply */
.pj-placeholder { border: 1.5px dashed var(--wp--preset--color--terracotta); border-radius: var(--wp--custom--radius); padding: 1rem 1.25rem; background: rgba(174, 77, 37, .05); }

/* Footer */
.pj-footer-heading { font-size: .8rem !important; letter-spacing: .14em; text-transform: uppercase; margin-bottom: .75rem; }
.pj-footer .wp-block-navigation a { text-decoration: none; }

/* Product page */
.pj-tagline { font-size: var(--wp--preset--font-size--large); font-weight: 600; color: var(--wp--preset--color--rust); }
.pj-product-top .wp-block-woocommerce-product-image-gallery img { border-radius: var(--wp--custom--radius); }
.pj-label-details summary { font-size: 1.125rem; }

/* Buttons: thumb-friendly */
.wp-element-button, .wp-block-button__link { min-height: 48px; }

/* No horizontal scroll on small screens */
html, body { overflow-x: clip; }

/* Checkout header: "← Back to cart" · logo · ✕ close */
.pj-checkout-header { border-bottom: 1px solid rgba(91, 56, 27, .15); }
.pj-checkout-header p { margin: 0; flex: 1 1 0; }
.pj-checkout-header .pj-logo { flex: 0 0 auto; }
.pj-checkout-header .pj-co-close { text-align: right; }
.pj-checkout-header .pj-co-back a,
.pj-checkout-header .pj-co-close a {
	display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
	min-height: 44px; min-width: 44px; padding: 0 .6rem;
	color: var(--wp--preset--color--brown); font-weight: 600; text-decoration: none; border-radius: 999px;
}
.pj-checkout-header .pj-co-close a { font-size: 1.35rem; line-height: 1; border: 1.5px solid rgba(91, 56, 27, .35); padding: 0; width: 44px; }
.pj-checkout-header a:hover, .pj-checkout-header a:focus-visible { background: var(--wp--preset--color--cream-deep); }
@media (max-width: 480px) { .pj-checkout-header .pj-co-label { display: none; } }

/* Cart & checkout: white form fields with a clear border, so they stand out from the cream page */
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-textarea,
.wc-blocks-components-select .wc-blocks-components-select__container,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-block-components-address-card,
.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option,
.wc-block-checkout__payment-method .wc-block-components-radio-control__option,
.woocommerce form .input-text,
.woocommerce form select,
.woocommerce form textarea {
	background-color: #fff !important;
	color: var(--wp--preset--color--brown);
}
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-blocks-components-select .wc-blocks-components-select__container,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.woocommerce form .input-text,
.woocommerce form select {
	border: 1px solid rgba(91, 56, 27, .35) !important;
	border-radius: 6px;
}
.wc-block-components-text-input input:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-components-combobox .wc-block-components-combobox-control input:focus {
	border-color: var(--wp--preset--color--brown) !important;
	box-shadow: 0 0 0 1px var(--wp--preset--color--brown);
	outline: none;
}
