/*
Theme Name: Pretty N Pink
Description: Pretty N Pink – Science & Beauty. An elegant shop design for peptide-based skincare.
Version: 1.2
Requires at least: 6.6
*/

/* Announcement bar */
.gc-announcement p { margin: 0; letter-spacing: 0.08em; }

/* Small uppercase labels above headings */
.gc-eyebrow { text-transform: uppercase; letter-spacing: 0.2em; font-weight: 600; font-family: var(--wp--preset--font-family--body); }

/* Header */
.gc-header .wp-block-site-logo img { height: auto; }
.wp-block-navigation a:hover, .wp-block-navigation a:focus-visible { color: var(--wp--preset--color--accent); }
.gc-header__icons { gap: var(--wp--preset--spacing--20); align-items: center; }
.gc-header .wc-block-customer-account a { color: var(--wp--preset--color--contrast); display: inline-flex; padding: 0.4rem; border-radius: 999px; }
.gc-header .wc-block-customer-account a:hover,
.gc-header .wc-block-customer-account a:focus-visible { color: var(--wp--preset--color--accent); }

/* Header: basket icon with item count (mini-cart) */
.gc-header .wc-block-mini-cart__button {
	color: var(--wp--preset--color--contrast);
	background: transparent;
	border: 0;
	border-radius: 999px;
	padding: 0.4rem;
	cursor: pointer;
	transition: color 0.2s ease, background-color 0.2s ease;
}
.gc-header .wc-block-mini-cart__button:hover,
.gc-header .wc-block-mini-cart__button:focus-visible {
	color: var(--wp--preset--color--accent);
	background-color: var(--wp--preset--color--subtle);
}
.gc-header .wc-block-mini-cart__button:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 2px; }
.gc-header .wc-block-mini-cart__icon { width: 1.6rem; height: 1.6rem; }
.gc-header .wc-block-mini-cart__badge {
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
	border: 2px solid var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0;
	min-width: 1.35rem;
	height: 1.35rem;
	box-sizing: border-box;
}

/* Mini-cart drawer */
.wc-block-mini-cart__drawer .wc-block-mini-cart__title,
.wc-block-mini-cart__drawer h2 {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 400;
	color: var(--wp--preset--color--contrast);
}
.wc-block-mini-cart__drawer .components-modal__content,
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer { background-color: var(--wp--preset--color--base); color: var(--wp--preset--color--contrast); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer { border-top: 1px solid var(--wp--preset--color--line); }
.wc-block-mini-cart__drawer .wc-block-components-product-name { color: var(--wp--preset--color--contrast); text-decoration: none; font-family: var(--wp--preset--font-family--heading); }
.wc-block-mini-cart__drawer .wc-block-cart-item__image img { border-radius: 4px; background-color: var(--wp--preset--color--subtle); }

/* Highlights */
.gc-highlights .wp-block-column {
	padding: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--wp--preset--color--accent);
	background-color: var(--wp--preset--color--base);
}
.gc-highlights .wp-block-column h3 { margin-bottom: var(--wp--preset--spacing--20); }

/* Footer */
.gc-footer .gc-eyebrow { margin-bottom: var(--wp--preset--spacing--30); }
.gc-footer-links { list-style: none; padding-left: 0; }
.gc-footer-links li { margin-bottom: 0.5rem; }
.gc-footer a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.gc-footer a:hover, .gc-footer a:focus-visible { color: var(--wp--preset--color--accent); text-decoration: underline; }

/* Outline buttons */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border: 1px solid currentColor;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--accent);
	color: #ffffff;
	border-color: var(--wp--preset--color--accent);
}

/* Contact page: berry card around the shop's own form */
.gc-contact-form {
	border: 1px solid var(--wp--preset--color--line);
	border-top: 3px solid var(--wp--preset--color--accent);
	border-radius: 6px;
	box-shadow: 0 18px 40px -24px rgba(43, 22, 48, 0.25);
}
.gc-contact-form > .gc-eyebrow { margin-bottom: 0; }
.gc-contact-form > h2 { margin-top: 0.35rem; }
.gc-contact-form .wp-block-separator.gc-contact-form__rule {
	width: 3.5rem;
	max-width: 3.5rem;
	height: 2px;
	border: 0;
	margin: var(--wp--preset--spacing--30) auto var(--wp--preset--spacing--40);
	opacity: 1;
}

/* Shop forms (genconstruct/form block). Classes: .gc-form (wrapper/form), .gc-form__field, .gc-form__label,
   .gc-form__required, .gc-form__help, .gc-form__error, .gc-form__submit, .gc-form__success.
   Rules are scoped with the card class so they win over the plugin's own stylesheet. */
.gc-contact-form .gc-form {
	--gc-form-accent: var(--wp--preset--color--accent);
	--gc-form-text: var(--wp--preset--color--contrast);
	--gc-form-muted: var(--wp--preset--color--muted);
	--gc-form-border: var(--wp--preset--color--line);
	--gc-form-field-bg: #ffffff;
	--gc-form-radius: 4px;
	--gc-form-gap: var(--wp--preset--spacing--30);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	margin: 0;
	color: var(--wp--preset--color--contrast);
	font-family: var(--wp--preset--font-family--body);
}
.gc-contact-form .gc-form form { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--30); margin: 0; }
.gc-contact-form .gc-form .gc-form__field { margin: 0; padding: 0; }
.gc-contact-form .gc-form label,
.gc-contact-form .gc-form .gc-form__label {
	display: block;
	margin: 0 0 0.35rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	font-size: 0.8125rem;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast);
}
.gc-contact-form .gc-form .gc-form__required { color: var(--wp--preset--color--accent); font-weight: 400; }
.gc-contact-form .gc-form .gc-form__help { color: var(--wp--preset--color--muted); font-size: 0.875rem; margin-top: 0.3rem; }
.gc-contact-form .gc-form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=hidden]),
.gc-contact-form .gc-form select,
.gc-contact-form .gc-form textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	background-color: #ffffff;
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 4px;
	padding: 0.8rem 0.95rem;
	font: inherit;
	font-size: 1rem;
	line-height: 1.4;
	box-shadow: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.gc-contact-form .gc-form textarea { min-height: 10rem; resize: vertical; }
.gc-contact-form .gc-form input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):hover,
.gc-contact-form .gc-form select:hover,
.gc-contact-form .gc-form textarea:hover { border-color: var(--wp--preset--color--muted); }
.gc-contact-form .gc-form input:focus-visible,
.gc-contact-form .gc-form select:focus-visible,
.gc-contact-form .gc-form textarea:focus-visible {
	border-color: var(--wp--preset--color--accent);
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 1px;
	box-shadow: 0 0 0 4px rgba(184, 49, 122, 0.12);
}
.gc-contact-form .gc-form input[type=checkbox],
.gc-contact-form .gc-form input[type=radio] { accent-color: var(--wp--preset--color--accent); }
.gc-contact-form .gc-form .gc-form__error,
.gc-contact-form .gc-form [role=alert] { color: #a3123a; font-size: 0.875rem; font-weight: 500; margin-top: 0.3rem; }
.gc-contact-form .gc-form [aria-invalid=true] { border-color: #a3123a; }
.gc-contact-form .gc-form button[type=submit],
.gc-contact-form .gc-form input[type=submit],
.gc-contact-form .gc-form .gc-form__submit {
	align-self: center;
	width: auto;
	min-height: 3rem;
	margin-top: var(--wp--preset--spacing--20);
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
	border: 0;
	border-radius: 999px;
	box-shadow: none;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.9rem 2.5rem;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}
.gc-contact-form .gc-form button[type=submit]:hover,
.gc-contact-form .gc-form button[type=submit]:focus-visible,
.gc-contact-form .gc-form input[type=submit]:hover,
.gc-contact-form .gc-form input[type=submit]:focus-visible,
.gc-contact-form .gc-form .gc-form__submit:hover,
.gc-contact-form .gc-form .gc-form__submit:focus-visible {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}
.gc-contact-form .gc-form button[type=submit]:focus-visible,
.gc-contact-form .gc-form .gc-form__submit:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 2px; }
.gc-contact-form .gc-form button[type=submit]:disabled,
.gc-contact-form .gc-form .gc-form__submit:disabled { background-color: var(--wp--preset--color--muted); color: #ffffff; cursor: wait; }
.gc-contact-form .gc-form .gc-form__success {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--line);
	border-left: 3px solid var(--wp--preset--color--accent);
	border-radius: 4px;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.125rem;
	text-align: center;
}
@media (max-width: 600px) {
	.gc-contact-form .gc-form button[type=submit],
	.gc-contact-form .gc-form input[type=submit],
	.gc-contact-form .gc-form .gc-form__submit { align-self: stretch; width: 100%; }
}

/* WooCommerce: buttons */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce ul.products li.product .button,
.wc-block-components-button:not(.is-link) {
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
	border: 0;
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.85rem 1.75rem;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:not(.is-link):hover {
	background-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}
.woocommerce button.button:disabled,
.woocommerce button.button.disabled { background-color: var(--wp--preset--color--muted); color: #ffffff; }
/* Secondary (outlined) block buttons, e.g. "View my cart" in the basket drawer */
.wc-block-components-button.outlined:not(.is-link) {
	background-color: transparent;
	color: var(--wp--preset--color--accent);
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--accent);
}
.wc-block-components-button.outlined:not(.is-link):hover,
.wc-block-components-button.outlined:not(.is-link):focus-visible {
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
}

/* WooCommerce: product grid */
.woocommerce ul.products li.product { text-align: center; }
.woocommerce ul.products li.product a img { border-radius: 4px; background-color: var(--wp--preset--color--subtle); margin-bottom: var(--wp--preset--spacing--30); }
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce div.product .product_title {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 400;
	color: var(--wp--preset--color--contrast);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 1.25rem; }
.woocommerce ul.products li.product a { text-decoration: none; }
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--wp--preset--color--contrast); font-weight: 500; }
.woocommerce .price del { color: var(--wp--preset--color--muted); }
.woocommerce .price ins { color: var(--wp--preset--color--accent); text-decoration: none; }
.woocommerce span.onsale {
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	min-height: 0;
	min-width: 0;
	padding: 0.35rem 0.75rem;
	line-height: 1.4;
	border-radius: 999px;
}
.woocommerce .star-rating span::before, .woocommerce p.stars a { color: var(--wp--preset--color--accent); }

/* Product cards (product collection grids) */
.gc-product-grid .wc-block-product { text-align: center; }
.gc-product-grid .wc-block-components-product-image img { border-radius: 4px; background-color: var(--wp--preset--color--subtle); }
.gc-product-grid .wp-block-post-title { font-size: 1.25rem; margin-top: var(--wp--preset--spacing--30); margin-bottom: 0.25rem; }
.gc-product-grid .wp-block-post-title a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.gc-product-grid .wp-block-post-title a:hover,
.gc-product-grid .wp-block-post-title a:focus-visible { color: var(--wp--preset--color--accent); }
.gc-product-grid .wc-block-components-product-price { color: var(--wp--preset--color--contrast); font-weight: 500; }
.gc-product-grid .wc-block-components-product-price del { color: var(--wp--preset--color--muted); }
.gc-product-grid .wc-block-components-product-price ins { color: var(--wp--preset--color--accent); text-decoration: none; }

/* Shop page: results count + sort menu row, page numbers */
.gc-shop-toolbar { align-items: center; row-gap: var(--wp--preset--spacing--20); }
.gc-shop-toolbar .woocommerce-result-count { margin: 0; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); }
.gc-shop-toolbar .woocommerce-ordering { margin: 0; }
.gc-shop-toolbar .woocommerce-ordering select { max-width: 100%; }
.gc-product-grid .wp-block-query-pagination { gap: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--small); }
.gc-product-grid .wp-block-query-pagination a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.gc-product-grid .wp-block-query-pagination a:hover,
.gc-product-grid .wp-block-query-pagination a:focus-visible { color: var(--wp--preset--color--accent); }
.gc-product-grid .wp-block-query-pagination .page-numbers { display: inline-block; min-width: 2.25rem; padding: 0.35rem 0.5rem; border-radius: 999px; text-align: center; box-sizing: border-box; }
.gc-product-grid .wp-block-query-pagination .page-numbers.current { background-color: var(--wp--preset--color--accent); color: #ffffff; }

/* Quick add basket icon on product photos */
.gc-quick-add__button {
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--accent);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	box-shadow: 0 4px 14px rgba(43, 22, 48, 0.12);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}
.gc-quick-add__button:hover,
.gc-quick-add__button:focus-visible { background-color: var(--wp--preset--color--accent); color: #ffffff; border-color: var(--wp--preset--color--accent); }
.gc-quick-add__button:focus-visible { outline: 2px solid var(--wp--preset--color--contrast); outline-offset: 2px; }

/* WooCommerce: single product page side padding lives in theme.json ("styles" > "css"),
   so it is always printed on WooCommerce's own product template. */

/* Product page */
.gc-product .wp-block-post-title { margin-top: 0.25rem; margin-bottom: var(--wp--preset--spacing--20); }
.gc-product__summary .wp-block-post-terms a { color: var(--wp--preset--color--accent); text-decoration: none; }
.gc-product__summary .wp-block-post-terms a:hover { text-decoration: underline; }
.gc-product__summary .wc-block-components-product-price { color: var(--wp--preset--color--contrast); }
.gc-product__summary .wp-block-post-excerpt { margin-top: var(--wp--preset--spacing--30); }
.gc-product__gallery img { border-radius: 4px; background-color: var(--wp--preset--color--subtle); }
.gc-product .gc-buy-now { margin-top: var(--wp--preset--spacing--40); padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--wp--preset--color--line); }

/* Add to basket row: quantity + Add to basket side by side, Buy it now full width underneath */
.woocommerce div.product form.cart:not(.variations_form),
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.75rem;
}
.woocommerce div.product form.cart:not(.variations_form)::before,
.woocommerce div.product form.cart:not(.variations_form)::after,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::before,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::after { display: none; }
.woocommerce div.product form.cart > table,
.woocommerce div.product form.cart > .wc-block-components-notice-banner { flex-basis: 100%; }
.woocommerce div.product form.cart div.quantity { float: none; margin: 0; }
.woocommerce div.product form.cart .quantity input.qty { height: 100%; min-height: 3rem; box-sizing: border-box; }
.woocommerce div.product form.cart .single_add_to_cart_button { float: none; flex: 1 1 12rem; min-height: 3rem; }
.woocommerce div.product form.cart table.variations { margin-bottom: var(--wp--preset--spacing--30); }
.woocommerce div.product form.cart table.variations th.label { font-weight: 600; font-size: 0.875rem; letter-spacing: 0.08em; text-transform: uppercase; padding-right: var(--wp--preset--spacing--30); }
.woocommerce div.product form.cart .reset_variations { color: var(--wp--preset--color--muted); font-size: 0.875rem; }

/* "Buy it now": elegant outlined twin of Add to basket */
.woocommerce div.product form.cart .gc-buy-now__button,
form.cart .gc-buy-now__button {
	flex: 1 1 100%;
	width: 100%;
	min-height: 3rem;
	margin: 0;
	box-sizing: border-box;
	background-color: transparent;
	color: var(--wp--preset--color--accent);
	border: 1px solid var(--wp--preset--color--accent);
	border-radius: 999px;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.85rem 1.75rem;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.woocommerce div.product form.cart .gc-buy-now__button:hover,
.woocommerce div.product form.cart .gc-buy-now__button:focus-visible,
form.cart .gc-buy-now__button:hover,
form.cart .gc-buy-now__button:focus-visible {
	background-color: var(--wp--preset--color--accent);
	color: #ffffff;
	border-color: var(--wp--preset--color--accent);
}
form.cart .gc-buy-now__button:focus-visible,
form.cart .single_add_to_cart_button:focus-visible { outline: 2px solid var(--wp--preset--color--contrast); outline-offset: 2px; }
.woocommerce div.product form.cart .gc-buy-now__button:disabled,
.woocommerce div.product form.cart .gc-buy-now__button.disabled,
form.cart .gc-buy-now__button:disabled,
form.cart .gc-buy-now__button.disabled {
	background-color: transparent;
	color: var(--wp--preset--color--muted);
	border-color: var(--wp--preset--color--line);
	cursor: not-allowed;
}

/* WooCommerce: product page tabs, tables, notices */
.woocommerce div.product .woocommerce-tabs ul.tabs li { background-color: var(--wp--preset--color--subtle); border-color: var(--wp--preset--color--line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { background-color: var(--wp--preset--color--base); }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--wp--preset--color--contrast); }
.woocommerce table.shop_table { border-color: var(--wp--preset--color--line); border-radius: 4px; }
.woocommerce table.shop_table td, .woocommerce table.shop_table th { border-color: var(--wp--preset--color--line); }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	background-color: var(--wp--preset--color--subtle);
	color: var(--wp--preset--color--contrast);
	border-top-color: var(--wp--preset--color--accent);
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--wp--preset--color--accent); }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { color: var(--wp--preset--color--contrast); }
.woocommerce nav.woocommerce-pagination ul li span.current { background-color: var(--wp--preset--color--accent); color: #ffffff; }
.woocommerce .woocommerce-breadcrumb, .woocommerce .woocommerce-result-count { color: var(--wp--preset--color--muted); }
.woocommerce .woocommerce-breadcrumb a { color: var(--wp--preset--color--muted); text-decoration: none; }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--wp--preset--color--accent); text-decoration: underline; }

/* theme.json can't style form fields, so they follow the palette from here; otherwise they keep the browser's white boxes. */
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=range]),
select,
textarea {
	background-color: #ffffff;
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 4px;
	padding: 0.7rem 0.85rem;
	font: inherit;
	line-height: 1.3;
}
input:not([type=checkbox]):not([type=radio]):hover, select:hover, textarea:hover { border-color: var(--wp--preset--color--muted); }
input::placeholder, textarea::placeholder { color: var(--wp--preset--color--muted); }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 1px; }
input[type=checkbox], input[type=radio] { accent-color: var(--wp--preset--color--accent); }
select option { background-color: #ffffff; color: var(--wp--preset--color--contrast); }
.woocommerce .quantity input.qty { width: 4.5em; text-align: center; }
