/* Solove site-wide styles: make the whole shop match the landing page (page-templates/landing.php).

   Where things are set:
   - Fonts, text/heading/button colours, button radius, heading letter-spacing:
     Savoy theme options (Savoy → Theme Settings → Typography / Styling). Not here.
   - Landing sections (.sl-section, .sl-wrap, .sl-h2, .sl-eyebrow, .sl-steps, .sl-faq, buttons ...): assets/css/landing.css,
     loaded for the "Solove – landing" and "Solove – turinio puslapis" templates.
   - This file: colour tokens for the whole site, extra block classes for content pages
     (About, FAQ, Contacts, policies ...) and small WooCommerce touches Savoy has no option for.

   Content page classes (block editor → Advanced → Additional CSS class):
     sl-page-hero      Group: page header band (H1 + optional .sl-eyebrow / .sl-sub)
     sl-section        Group: section with vertical padding   (+ sl-section--tight, sl-bg-cream, sl-bg-sand)
     sl-wrap sl-narrow Group: centred content width (1240px / 780px)
     sl-prose          Group: long text (policies) - readable lists, headings, separators
     sl-cards / sl-card Groups: grid of cream cards
     sl-split          Group with two children: sl-split__media (image) + sl-split__text
     sl-media          Image: rounded, full width (+ sl-media--narrow: 780px, space above)
     sl-note           Paragraph: small muted note
     sl-table          Table: simple two-column list (e.g. shipping prices)
*/

:root {
	--sl-ink: #2b2622;
	--sl-muted: #6f655c;
	--sl-gold: #b08a5b;
	--sl-cream: #f7f2eb;
	--sl-sand: #efe6da;
	--sl-dark: #2b2622;
	--sl-line: #e6ddd1;
	--sl-radius: 14px;
}

/* Content pages (template "Solove – turinio puslapis")
--------------------------------------------------------------- */
.sl-page-hero { background: linear-gradient(180deg, var(--sl-cream) 0%, #fff 100%); padding: 72px 24px 40px; text-align: center; }
.solove-landing .sl-page-hero h1 { font-size: clamp(34px, 4.6vw, 58px); line-height: 1.08; margin: 0 auto 16px; max-width: 900px; }
.sl-page-hero .sl-sub { margin-bottom: 0 !important; }
.sl-page-hero .sl-eyebrow { margin-bottom: 14px !important; }
.sl-section--tight { padding: 56px 0; }
.sl-page-hero + .sl-section { padding-top: 40px; }
.sl-bg-cream { background: var(--sl-cream); }
.sl-bg-sand { background: var(--sl-sand); }
.solove-landing .sl-h2.has-text-align-left, .solove-landing .sl-split__text .sl-h2, .solove-landing .sl-split__text .sl-eyebrow { text-align: left; }

/* Long text */
.sl-prose { font-size: 17px; line-height: 1.75; color: var(--sl-muted); }
.solove-landing .sl-prose p { margin: 0 0 16px; }
.sl-prose strong { color: var(--sl-ink); }
.solove-landing .sl-prose h2 { font-size: clamp(22px, 2.4vw, 28px); line-height: 1.25; margin: 48px 0 16px; }
.solove-landing .sl-prose h3 { font-size: 19px; line-height: 1.35; margin: 32px 0 12px; }
.solove-landing .sl-prose > h2:first-child, .solove-landing .sl-prose > h3:first-child { margin-top: 0; }
.solove-landing .sl-prose ul, .solove-landing .sl-prose ol { margin: 0 0 20px; padding-left: 1.3em; }
.sl-prose ul > li { list-style: disc outside; }
.sl-prose ol > li { list-style: decimal outside; }
.sl-prose li { margin: 0 0 6px; padding-left: 4px; }
.sl-prose li::marker { color: var(--sl-gold); }
.solove-landing .sl-prose hr, .solove-page hr.wp-block-separator { border: 0; border-top: 1px solid var(--sl-line); margin: 40px 0; opacity: 1; }
.sl-prose a, .sl-card a, .solove-page .sl-faq .wp-block-details a, .sl-note a { color: var(--sl-gold); text-decoration: none; border-bottom: 1px solid currentColor; }

/* Cards */
.sl-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 40px; }
.sl-card { background: var(--sl-cream); border-radius: var(--sl-radius); padding: 36px 30px; color: var(--sl-muted); line-height: 1.6; }
.solove-landing .sl-card h3 { font-size: 20px; margin: 0 0 14px; }
.solove-landing .sl-card p:last-child { margin-bottom: 0; }

/* Image + text */
.sl-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; }
.sl-split__media img { width: 100%; border-radius: var(--sl-radius); object-fit: cover; }
.sl-split__text { color: var(--sl-muted); line-height: 1.65; }
.solove-landing .sl-split__text .sl-h2 { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.3; }
.solove-landing .sl-media { margin: 0 auto 40px; }
.solove-landing .sl-media img { width: 100%; border-radius: var(--sl-radius); }
.solove-landing .sl-media:last-child { margin-bottom: 0; }
.solove-landing .sl-media--narrow { max-width: 780px; margin-top: 56px; }
.sl-note { text-align: center; font-size: 14px; color: var(--sl-muted); }
.sl-note strong { color: var(--sl-ink); }

/* FAQ answers (content pages only; the landing FAQ is styled in landing.css): lists and tables inside Details blocks */
.solove-page .sl-faq .wp-block-details ul { list-style: disc; padding-left: 1.3em; margin: 0 0 18px; color: var(--sl-muted); line-height: 1.65; }
.solove-page .sl-faq .wp-block-details li { margin: 0 0 6px; list-style: disc outside; }
.solove-page .sl-faq .sl-h2 { margin-bottom: 8px; }
.sl-table { margin: 0 0 18px; max-width: 420px; }
.sl-table table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sl-table td { padding: 7px 0; border: 0; border-bottom: 1px solid var(--sl-line); color: var(--sl-muted); }
.sl-table td:last-child { text-align: right; color: var(--sl-ink); white-space: nowrap; }

@media (max-width: 1024px) {
	.sl-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
	.sl-page-hero { padding: 48px 16px 28px; }
	.sl-section--tight { padding: 44px 0; }
	.sl-cards, .sl-split { grid-template-columns: 1fr; gap: 20px; }
	.sl-split { gap: 32px; }
	.sl-prose { font-size: 16px; }
}

/* Shop, product, cart, checkout, account (Savoy + WooCommerce templates)
--------------------------------------------------------------- */
/* Main buttons: same feel as the landing buttons (shape comes from the "Buttons" border-radius theme option) */
.single_add_to_cart_button,
.woocommerce-button,
.woocommerce-Button,
.checkout-button,
#place_order,
.nm-myaccount-login .button,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button {
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: 14px;
}
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button {
	border-radius: 999px !important;
	background-color: var(--sl-dark);
	color: #fff;
}
.wc-block-components-button:not(.is-link):hover,
.single_add_to_cart_button:hover,
#place_order:hover { background-color: var(--sl-gold) !important; color: #fff; }

/* Block cart/checkout headings use the heading font like the rest of the site */
.theme-savoy .wc-block-cart.wp-block-woocommerce-filled-cart-block:before,
.wc-block-components-title,
.wc-block-cart__totals-title,
.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-checkout-order-summary__title-text {
	font-family: 'Aboreto', 'Alike', Georgia, serif !important;
	letter-spacing: .04em;
	text-transform: none;
	color: var(--sl-ink);
}
.wc-block-components-panel, .wc-block-components-totals-wrapper, .wc-block-components-sidebar .wc-block-components-panel { border-color: var(--sl-line); }

/* Single product: quantity box as a separate pill above the pill button (Savoy joins them into one box) */
.single-product .summary form.cart .nm-quantity-wrap { border: 1px solid var(--sl-line); border-radius: 999px; background: #fff; margin-bottom: 10px; }

/* My account login/register: cream background like the landing sections */
.nm-woocommerce-account-login .nm-page-wrap { background-color: var(--sl-cream); }

/* Product titles: Aboreto is all capitals, so keep it smaller than Savoy's default heading size */
.single-product .summary .product_title { font-size: 22px !important; line-height: 1.35; letter-spacing: .05em; }
.woocommerce-loop-product__title { font-size: 13px !important; line-height: 1.5 !important; letter-spacing: .05em; }
@media (max-width: 767px) {
	.single-product .summary .product_title { font-size: 18px !important; }
}

/* Shop filters: chosen options (Savoy shows them as a pill with ✕) move to the top of their list,
   so a chosen colour is visible without scrolling the colour list */
#nm-shop-sidebar .widget_layered_nav ul.woocommerce-widget-layered-nav-list { display: flex; flex-direction: column; }
#nm-shop-sidebar .widget_layered_nav li.chosen { order: -1; }

/* Quote box (Apie mus): logo + text on a sand background; real text, so it stays readable on phones */
.sl-quote { background: radial-gradient(120% 90% at 20% 10%, #fbf8f4 0%, transparent 60%), linear-gradient(135deg, #efe8de 0%, #e2d9cc 100%); border-radius: var(--sl-radius, 16px); padding: 48px 44px; margin: 0 0 40px; text-align: center; }
.sl-quote .sl-quote__logo { margin: 0 auto 22px; }
.sl-quote .sl-quote__logo img { width: 130px; height: auto; display: inline-block; }
.solove-landing .sl-quote p { font-size: clamp(17px, 1.6vw, 20px); line-height: 1.6; color: var(--sl-ink); margin: 0 0 14px; }
.solove-landing .sl-quote p:last-child { margin-bottom: 0; }

/* Phones: Savoy's body text is 14px; small texts of the landing/content sections one step up */
@media (max-width: 768px) {
	.sl-quote { padding: 36px 24px; }
	.solove-landing .sl-step p,
	.solove-landing .sl-why__list li,
	.solove-landing .sl-faq .wp-block-details p,
	.solove-landing .wp-block-details p { font-size: 16px; }
	.solove-landing .sl-scent__lead { font-size: 15px; }
	.solove-landing .sl-scent__notes,
	.solove-landing .sl-scent__go,
	.solove-landing .sl-hero__code,
	.sl-note { font-size: 14px; }
	.solove-landing .sl-scent__mood { font-size: 13px; }
	.woocommerce-loop-product__title { font-size: 13px !important; }
}

/* Header: "Parduotuvė" mega menu (Savoy "megamenu full col-4", category images set in Appearance → Menus)
   ------------------------------------------------------------------ */
.nm-menu .megamenu.full > .sub-menu > ul { max-width: 1040px; display: flex; align-items: stretch; }
.nm-menu .megamenu.full > .sub-menu > ul > li { float: none; flex: 1 1 0; }
.nm-menu .megamenu > .sub-menu > ul > li.nm-menu-item-has-image { border-right-color: #eee; }
.nm-menu .megamenu > .sub-menu > ul > li > a img {
	width: 100%; max-width: 190px; max-height: none; aspect-ratio: 1; object-fit: cover;
	margin: 0 auto 16px; border-radius: 14px; transition: transform .3s ease;
}
.nm-menu .megamenu > .sub-menu > ul > li > a:hover img { transform: scale(1.03); }
.nm-menu .megamenu.full > .sub-menu > ul > li.nm-menu-item-has-image > a { font-size: 15px; color: #282828; }
.nm-menu .megamenu.full > .sub-menu > ul > li:not(.nm-menu-item-has-image) { display: flex; align-items: center; justify-content: center; }
.nm-menu .megamenu.full > .sub-menu > ul > li:not(.nm-menu-item-has-image) > a {
	padding: 12px 26px; border: 1px solid #b08a5b; border-radius: 999px; color: #b08a5b; font-size: 15px;
}
.nm-menu .megamenu.full > .sub-menu > ul > li:not(.nm-menu-item-has-image) > a:hover { background: #b08a5b; color: #fff; }
.nm-menu .megamenu.full > .sub-menu { border-radius: 0 0 18px 18px; }

/* Shop page heading (functions.php "SEO: shop page heading") */
.solove-shop-header { padding: 28px 16px 8px; text-align: center; }
.solove-shop-header h1 { margin: 0 0 10px; }
.solove-shop-header .term-description { max-width: 680px; margin: 0 auto; }