/* NoirMusk — site-wide finishing rules. Loaded after every other stylesheet.

   1. Every card / box has a 10px corner radius.
   2. Phones (767px and below):
        - each section has 70px above and below and 20px at the sides
        - buttons use padding: 12px 20px
        - the home banner label is 12px
   3. The home mood cards can no longer poke out of the container.                                             */

/* ------------------------------------------------------------ 1. card radius */
html body :is(
	.noirmusk-mood-card,
	.ncoll-scent,
	.noirmusk-about-story__media,
	.ncontact-card,
	.noirmusk-accordion__item,
	.noirmusk-trust-row li,
	.noirmusk-tester,
	.noirmusk-blog-card,
	.noirmusk-blog-card__thumb,
	.noirmusk-thanks__eta,
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error,
	.woocommerce-noreviews,
	.noirmusk-policy__panel,
	.noirmusk-policy__rates
) {
	border-radius: 10px;
}
html body .woocommerce-message,
html body .woocommerce-info,
html body .woocommerce-error {
	overflow: hidden;
}
html body ul.products li.product {
	border-radius: 10px;
}

/* ------------------------------------------------------------ 3. mood cards stay inside the container */
html body .noirmusk-mood-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
html body .noirmusk-mood-card {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}
@media (max-width: 991px) {
	html body .noirmusk-mood-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ------------------------------------------------------------ 2. phones */
@media (max-width: 767px) {

	html body .noirmusk-mood-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	/* home banner label */
	html body .noirmusk-hero__text .noirmusk-eyebrow {
		font-size: 12px;
	}

	/* ---- sections: 70px top and bottom, 20px left and right ---- */
	/* home */
	html body .noirmusk-section.noirmusk-mood-section,
	html body .noirmusk-section.noirmusk-home-products {
		padding: 70px 20px;
	}
	html body .noirmusk-split-section .noirmusk-split-section__text {
		padding: 70px 20px;
	}
	/* collection */
	html body .noirmusk-coll .ncoll-section,
	html body .noirmusk-coll .ncoll-section--favs {
		padding: 70px 0;
	}
	html body .noirmusk-coll .ncoll-pair__head {
		padding: 70px 20px 30px;
	}
	html body .noirmusk-coll .ncoll-pair__side {
		padding-bottom: 70px;
	}
	html body .ncoll-cta__inner {
		padding: 70px 20px;
	}
	/* about */
	html body .noirmusk-about-story {
		padding: 70px 0;
	}
	html body .noirmusk-about-approach {
		padding: 70px 0;
	}
	html body .noirmusk-about-quote {
		padding: 70px 20px;
	}
	html body .noirmusk-about-signature__text {
		padding: 70px 20px;
	}
	/* shipping & returns, FAQs */
	html body .noirmusk-policy__jump {
		margin-bottom: 70px;
	}
	html body .noirmusk-policy__section {
		margin-bottom: 70px;
	}
	html body .noirmusk-policy__help {
		margin-bottom: 70px;
		padding: 70px 20px;
	}
	/* contact */
	html body .ncontact-main {
		padding: 70px 0;
	}
	html body .ncontact-cta__inner {
		padding: 70px 20px;
	}
	/* product page */
	html body .noirmusk-related {
		padding: 70px 0;
	}

	/* ---- footer: no clearfix pseudo-elements in the grid, and its own padding ---- */
	html body .noirmusk-footer__top::before,
	html body .noirmusk-footer__top::after {
		content: none !important;
		display: none !important;
	}
	html body .noirmusk-footer__top {
		padding: 70px 15px 20px;
	}

	/* ---- buttons: padding 12px 20px ---- */
	html body :is(
		.noirmusk-btn-dark,
		.noirmusk-mood-card__btn,
		.noirmusk-home-products__btn,
		.noirmusk-policy__btn,
		.noirmusk-404__btn,
		.noirmusk-thanks-actions__btn,
		.noirmusk-mp-actions__btn,
		.noirmusk-about-signature__btn,
		.noirmusk-stickybar__btn,
		.noirmusk-sheet-apply,
		.noirmusk-coupon__btn,
		.noirmusk-coll .ncoll-btn,
		.noirmusk-contact .ncontact-btn,
		.ncontact-card input.wpcf7-submit,
		.single_add_to_cart_button,
		.checkout-button,
		#place_order,
		.woocommerce-cart td.actions .button,
		.woocommerce .return-to-shop .button,
		.woocommerce-order-received .button,
		.woocommerce-account .woocommerce-Button,
		.noirmusk-account .woocommerce-form-login__submit,
		.noirmusk-account .woocommerce-form-register__submit,
		ul.products li.product a.button,
		ul.products li.product a.noirmusk-atc,
		.woocommerce-cart .woocommerce .cart_totals .button
	) {
		height: auto !important;
		min-height: 0 !important;
		padding: 12px 20px !important;
		line-height: 1.4 !important;
	}
}
